Skip to content

E
ElectricitySheep
Commit 305e5c9c authored by zhengke's avatar zhengke
Browse files
Options

修改

parent 7fb7d38f
Hide whitespace changes
Inline Side-by-side
Showing with 216 additions and 2 deletions
src/components/StoreDesign/liveManage.vue
View file @ 305e5c9c
......@@ -72,7 +72,11 @@
<el-tooltip class="item" effect="dark" content="图片上传" placement="top">
<img @click="imgupload(scope.row)" class="app-order-icon"
src="../../assets/img/userman/imgsc.png" alt="">
</el-tooltip>
</el-tooltip>
<el-tooltip class="item" effect="dark" content="直播配置" placement="top">
<img @click="goLiveConfig(scope.row.ID)" class="app-order-icon"
src="../../assets/img/userman/edit.png" alt="">
</el-tooltip>
</template>
</el-table-column>
......@@ -162,7 +166,7 @@ import ChooseImg from "@/components/global/ChooseImg.vue";
this.imgMsg.ExtensionImg = img;
this.addOrUpdateHouseImg()
},
addOrUpdateHouseImg(){
addOrUpdateHouseImg(){
this.btnload=true;
this.apipost("/api/Publish/AddOrUpdateHouseImg", this.imgMsg, res => {
this.btnload=false;
......@@ -174,6 +178,16 @@ import ChooseImg from "@/components/global/ChooseImg.vue";
})
},
//跳转至直播配置
goLiveConfig(ID){
let routeData = this.$router.resolve({
name: 'liveSet',
query: {
Id: ID
}
});
window.open(routeData.href, "_blank");
}
}
}
</script>
......
src/components/StoreDesign/liveSet.vue 0 → 100644
View file @ 305e5c9c
<style>
.liveConfig .custom_Main {
display: flex;
}
.liveConfig .custom_mobile_box {
width: 400px;
height: 740px;
padding: 35px 11px;
background-color: #fff;
border-radius: 30px;
margin-right: 20px;
display: flex;
flex-direction: column;
}
.liveConfig .custom_bg_box {
position: relative;
border: 1px solid #e2e3e3;
width: 750px;
height: 1334px;
zoom: 0.5;
}
.liveConfig .custom_bg_pic {
width: 100%;
height: 100%;
background-size: 100% 100%;
background-position: center;
}
.liveConfig .custom_AppImage {
background: url('../../assets/img/default_qr_code.png') no-repeat;
background-size: cover;
background-position: center center;
position: absolute;
}
.liveConfig .custom_formBody {
padding: 20px 35% 20px 20px;
background-color: #fff;
margin-bottom: 20px;
width: 100%;
height: 100%;
position: relative;
min-width: 640px;
display: flex;
flex-direction: column;
}
.liveConfig .custom_bottom {
border: 1px solid #EBEEF5;
background-color: #FFF;
color: #303133;
-webkit-transition: .3s;
transition: .3s;
border-radius: 4px;
margin-top: 35px;
}
.liveConfig .customShareBtn {
position: absolute !important;
bottom: -52px;
left: 0;
}
.customShareBtn .el-button--small {
padding: 9px 25px;
}
</style>
<template>
<div class="liveConfig">
<template>
<div class="custom_Main">
<div class="custom_mobile_box">
<div class="custom_bg_box">
<div class="custom_bg_pic" :style="{ backgroundImage:'url('+LiveBgImg+')'}">
</div>
<div class="custom_AppImage" :style="{left:ShareMsg.LiveQrCodePaddingLeft+'px',
width:ShareMsg.LiveQrCodeSize+'px',height:ShareMsg.LiveQrCodeSize+'px',top:ShareMsg.LiveQrCodePaddingTop+'px',
'borderRadius':ShareMsg.LiveQrCodeType==0?'50%':'0%'}"></div>
</div>
</div>
<div class="custom_formBody">
<div class="custom_bottom">
<template>
<div class="el-card__header">二维码设置</div>
<el-form label-width="20%" style="padding:20px;">
<el-form-item label="样式" size="small">
<el-radio-group v-model="ShareMsg.LiveQrCodeType">
<el-radio :label="0">圆形</el-radio>
<el-radio :label="1">方形</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="大小" size="small">
<el-slider v-model="ShareMsg.LiveQrCodeSize" @change="getCodeMax(ShareMsg.LiveQrCodeSize)" :max="300"
show-input>
</el-slider>
</el-form-item>
<el-form-item label="上边距" size="small">
<el-slider v-model="ShareMsg.LiveQrCodePaddingTop" :max="maxTwocodeTop" show-input></el-slider>
</el-form-item>
<el-form-item label="左边距" size="small">
<el-slider v-model="ShareMsg.LiveQrCodePaddingLeft" :max="maxTwocodeLeft" show-input></el-slider>
</el-form-item>
</el-form>
</template>
</div>
<div class="customShareBtn">
<el-button size="small" type="primary" @click="SetLiveConfig()">保存</el-button>
</div>
</div>
</div>
</template>
</div>
</template>
<script>
export default {
data() {
return {
//二维码最大上边距
maxTwocodeTop: 0,
//二维码最大左边距
maxTwocodeLeft: 0,
//分销默认背景图
sharePosterDefaultImg: this.domainManager().ImageUrl + '/Static/livedefault.jpg',
LiveBgImg: "", //海报背景图
//分销海报
ShareMsg: {
ID: 0,
LiveQrCodeSize: 0, //二维码大小
LiveQrCodePaddingTop: 0, //二维码上间距
LiveQrCodePaddingLeft: 0, //二维码左间距
LiveQrCodeType: 0, //二维码形状(0-圆形，1-方形)
},
msg:{
ID:0,
PageIndex:1,
PageSize:1
}
};
},
created() {},
methods: {
//拉伸二维码尺寸动态设置最大值
getCodeMax(chicun) {
this.maxTwocodeTop = 1334 - chicun;
this.maxTwocodeLeft = 750 - chicun;
},
//获取分销海报
GetLiveConfig() {
this.apipost("/api/Publish/GetLiveHousePageList", this.msg, res => {
if (res.data.resultCode == 1) {
var jsonData = res.data.data.pageData[0];
if (jsonData) {
this.ShareMsg.ID = jsonData.ID;
this.LiveBgImg = jsonData.ExtensionImg;
this.ShareMsg.LiveQrCodePaddingTop = jsonData.LiveQrCodePaddingTop;
this.ShareMsg.LiveQrCodePaddingLeft = jsonData.LiveQrCodePaddingLeft;
this.ShareMsg.LiveQrCodeSize = jsonData.LiveQrCodeSize;
this.ShareMsg.LiveQrCodeType = jsonData.LiveQrCodeType;
} else {
this.LiveBgImg = this.sharePosterDefaultImg;
this.ShareMsg.LiveQrCodePaddingTop = 1182;
this.ShareMsg.LiveQrCodePaddingLeft = 585;
this.ShareMsg.LiveQrCodeSize = 140;
this.ShareMsg.LiveQrCodeType = 0;
}
} else {
this.Error(res.data.message);
}
})
},
//添加修改分销海报
SetLiveConfig() {
this.apipost("/api/Publish/SetLiveQrCode", this.ShareMsg, res => {
if (res.data.resultCode == 1) {
this.GetLiveConfig();
this.Success(res.data.message);
} else {
this.Error(res.data.message);
}
})
}
},
mounted() {
this.maxTwocodeTop = 1334 - this.ShareMsg.LiveQrCodeSize;
this.maxTwocodeLeft = 750 - this.ShareMsg.LiveQrCodeSize;
this.msg.ID = this.$route.query.Id;
this.GetLiveConfig();
}
};
</script>
src/router/index.js
View file @ 305e5c9c
......@@ -630,6 +630,12 @@ export default new Router({
name: 'liveConfig',
component: resolve => require(['@/components/StoreDesign/liveConfig'], resolve),
},
//直播管理 内容管理 直播配置=复制
{
path: '/liveSet',
name: 'liveSet',
component: resolve => require(['@/components/StoreDesign/liveSet'], resolve),
},
//店铺管理 员工管理 基础设置
{
path: '/Infrastructure',
......
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