Commit da206835 authored by 黄奎's avatar 黄奎

页面修改

parent 053425e4
...@@ -17,16 +17,19 @@ ...@@ -17,16 +17,19 @@
<div style="position:relative;" :key="index"> <div style="position:relative;" :key="index">
<img :src="item.imgBg" style="width: 100%;"> <img :src="item.imgBg" style="width: 100%;">
<div class="module-name"> <div class="module-name">
<template v-if="item.video_url!=''"> <template v-if="item.key=='video'&& item.video_url!=''">
<div class="video_msg">{{item.video_url}}</div> <div class="video_msg">{{item.video_url}}</div>
</template> </template>
<template v-else>{{item.name}}</template> <template v-else>{{item.name}}</template>
</div> </div>
<el-tooltip class="item" effect="dark" content="删除" placement="top-start"> <el-tooltip class="item" effect="dark" content="删除" placement="top-start">
<img @click="delPlugn(index)" :src="domainManager().ImageUrl+'/Static/icon-destroy.png'" class="module-icon"> <img @click="delPlugn(index)" :src="domainManager().ImageUrl+'/Static/icon-destroy.png'"
class="module-icon">
</el-tooltip> </el-tooltip>
<el-tooltip class="item" effect="dark" content="编辑" placement="top-start"> <el-tooltip class="item" effect="dark" content="编辑" placement="top-start">
<img v-if="item.is_edit==1&&item.key=='video'" @click="comCkVideo=index,isShowVideo=true" style="left:20px;" :src="domainManager().ImageUrl+'/Static/icon-edit.png'" class="module-icon"> <img v-if="item.is_edit==1&&item.key=='video'" @click="comCkVideo=index,isShowVideo=true"
style="left:20px;" :src="domainManager().ImageUrl+'/Static/icon-edit.png'"
class="module-icon">
</el-tooltip> </el-tooltip>
</div> </div>
</template> </template>
...@@ -39,15 +42,17 @@ ...@@ -39,15 +42,17 @@
<el-tabs v-model="activeName"> <el-tabs v-model="activeName">
<el-tab-pane label="常用" name="first"> <el-tab-pane label="常用" name="first">
<div flex="wrap:wrap" class="module-box"> <div flex="wrap:wrap" class="module-box">
<template v-for="item in ListData"> <template v-for="item in PlusInData">
<div flex="dir:top" class="module-item-box" v-for="(childItem,index) in item.list" :key="index" v-if="item.key=='normal'"> <div flex="dir:top" class="module-item-box" v-for="(childItem,index) in item.list" :key="index"
v-if="item.key=='normal'">
<div flex="main:center cross:center" class="name-box">{{childItem.name}}</div> <div flex="main:center cross:center" class="name-box">{{childItem.name}}</div>
<div flex="main:center cross:center" class="edit-box"> <div flex="main:center cross:center" class="edit-box">
<div class="home_Add" @click="addPlugn(childItem)"> <div class="home_Add" @click="addPlugn(childItem)">
<img :src="domainManager().ImageUrl+'/Static/plus.png'" alt=""> <img :src="domainManager().ImageUrl+'/Static/plus.png'" alt="">
</div> </div>
<div class="home_Add" style="margin-left:10px;" @click="isShowDialog(childItem)" v-if="childItem.is_edit==1&&childItem.key!='video'"> <div class="home_Add" style="margin-left:10px;" @click="isShowDialog(childItem)"
<img src="../../assets/img/userman/edit.png" alt=""/> v-if="childItem.is_edit==1&&childItem.key!='video'">
<img src="../../assets/img/userman/edit.png" alt="" />
</div> </div>
</div> </div>
</div> </div>
...@@ -56,33 +61,52 @@ ...@@ -56,33 +61,52 @@
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="商品分类" name="second"> <el-tab-pane label="商品分类" name="second">
<div flex="wrap:wrap" class="module-box"> <div flex="wrap:wrap" class="module-box">
<template v-for="item in ListData"> <template v-for="item in PlusInData">
<div flex="dir:top" class="module-item-box" v-for="(childItem,index) in item.list" :key="index" v-if="item.key=='cat'"> <div flex="dir:top" class="module-item-box" v-for="(childItem,index) in item.list" :key="index"
v-if="item.key=='cat'">
<div flex="main:center cross:center" class="name-box">{{childItem.name}}</div> <div flex="main:center cross:center" class="name-box">{{childItem.name}}</div>
<div flex="main:center cross:center" class="edit-box" @click="addPlugn(childItem)"> <div flex="main:center cross:center" class="edit-box" @click="addPlugn(childItem)">
<div class="home_Add"> <div class="home_Add">
<img :src="domainManager().ImageUrl+'/Static/plus.png'" alt=""> <img :src="domainManager().ImageUrl+'/Static/plus.png'" alt="">
</div> </div>
<div class="home_Add" style="margin-left:10px;" v-if="childItem.is_edit==1"> <div class="home_Add" style="margin-left:10px;" v-if="childItem.is_edit==1">
<img src="../../assets/img/userman/edit.png" alt=""/> <img src="../../assets/img/userman/edit.png" alt="" />
</div>
</div>
</div>
</template>
</div>
</el-tab-pane>
<el-tab-pane label="图片魔方" name="third">
<div flex="wrap:wrap" class="module-box">
<template v-for="item in PlusInData">
<div flex="dir:top" class="module-item-box" v-for="(childItem,index) in item.list" :key="index"
v-if="item.key=='block'">
<div flex="main:center cross:center" class="name-box">{{childItem.name}}</div>
<div flex="main:center cross:center" class="edit-box" @click="addPlugn(childItem)">
<div class="home_Add">
<img :src="domainManager().ImageUrl+'/Static/plus.png'" alt="">
</div>
<div class="home_Add" style="margin-left:10px;" v-if="childItem.is_edit==1">
<img src="../../assets/img/userman/edit.png" alt="" />
</div> </div>
</div> </div>
</div> </div>
</template> </template>
</div> </div>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="图片魔方" name="third">角色管理</el-tab-pane>
<el-tab-pane label="插件" name="fourth"> <el-tab-pane label="插件" name="fourth">
<div flex="wrap:wrap" class="module-box"> <div flex="wrap:wrap" class="module-box">
<template v-for="item in ListData"> <template v-for="item in PlusInData">
<div flex="dir:top" class="module-item-box" v-for="(childItem,index) in item.list" :key="index" v-if="item.key=='plugin'"> <div flex="dir:top" class="module-item-box" v-for="(childItem,index) in item.list" :key="index"
v-if="item.key=='plugin'">
<div flex="main:center cross:center" class="name-box">{{childItem.name}}</div> <div flex="main:center cross:center" class="name-box">{{childItem.name}}</div>
<div flex="main:center cross:center" class="edit-box" @click="addPlugn(childItem)"> <div flex="main:center cross:center" class="edit-box" @click="addPlugn(childItem)">
<div class="home_Add"> <div class="home_Add">
<img :src="domainManager().ImageUrl+'/Static/plus.png'" alt=""> <img :src="domainManager().ImageUrl+'/Static/plus.png'" alt="">
</div> </div>
<div class="home_Add" style="margin-left:10px;" v-if="childItem.is_edit==1"> <div class="home_Add" style="margin-left:10px;" v-if="childItem.is_edit==1">
<img src="../../assets/img/userman/edit.png" alt=""/> <img src="../../assets/img/userman/edit.png" alt="" />
</div> </div>
</div> </div>
</div> </div>
...@@ -91,11 +115,9 @@ ...@@ -91,11 +115,9 @@
</el-tab-pane> </el-tab-pane>
</el-tabs> </el-tabs>
</div> </div>
<el-button class="button-item" size="small" type="primary">保存</el-button> <el-button class="button-item" size="small" type="primary" @click="SaveHomeData()">保存</el-button>
</div> </div>
</div> </div>
</div> </div>
</template> </template>
<!-- 导航图标编辑 --> <!-- 导航图标编辑 -->
...@@ -244,7 +266,6 @@ ...@@ -244,7 +266,6 @@
<el-button size="small" type="danger" @click="saveVideo('videoMsg')">确 定</el-button> <el-button size="small" type="danger" @click="saveVideo('videoMsg')">确 定</el-button>
</span> </span>
</el-dialog> </el-dialog>
</div> </div>
</template> </template>
<script> <script>
...@@ -255,24 +276,24 @@ ...@@ -255,24 +276,24 @@
export default { export default {
data() { data() {
return { return {
comCkVideo:-1, comCkVideo: -1,
//选择图片 //选择图片
chooseImg:'', chooseImg: '',
//导航图标 //导航图标
isShowNav:false, isShowNav: false,
//公告 //公告
isShowNotice:false, isShowNotice: false,
//专题 //专题
isShowTotic:false, isShowTotic: false,
//领券中心 //领券中心
isShowCoupon:false, isShowCoupon: false,
//选图片 //选图片
choicImg:false, choicImg: false,
//视频 //视频
isShowVideo:false, isShowVideo: false,
isChoiceVideo:false, isChoiceVideo: false,
radio:'4', radio: '4',
activeName:'first', activeName: 'first',
dataList: [], dataList: [],
addMsg: { addMsg: {
RoleName: '', //角色名称 RoleName: '', //角色名称
...@@ -280,35 +301,35 @@ ...@@ -280,35 +301,35 @@
RoleAuth: '', //角色权限 RoleAuth: '', //角色权限
}, },
//导航图标msg //导航图标msg
navMsg:{ navMsg: {
row_num:4 row_num: 4
}, },
//视频 //视频
videoMsg:{ videoMsg: {
video_url:'', //视频文件 video_url: '', //视频文件
video_pic_url:'' //封面图 video_pic_url: '' //封面图
}, },
//公告msg //公告msg
noticeMsg:{ noticeMsg: {
NoticeName:'', //公告名称 NoticeName: '', //公告名称
NoticeContent:'', //公告内容 NoticeContent: '', //公告内容
notice_bg_color:'', //公告背景色 notice_bg_color: '', //公告背景色
notice_text_color:'', //公告文字颜色 notice_text_color: '', //公告文字颜色
notice_url:'',//图标 notice_url: '', //图标
}, },
//专题 //专题
topicMsg:{ topicMsg: {
topic_num:'1', //专题显示数量 topic_num: '1', //专题显示数量
topic_url:'', topic_url: '',
topic_url_2:'' topic_url_2: ''
}, },
//领券中心 //领券中心
couopnMsg:{ couopnMsg: {
coupon_not_url:'', //未领取 coupon_not_url: '', //未领取
coupon_url:'' //已领取图 coupon_url: '' //已领取图
}, },
//插件 //插件
ListData:[], PlusInData: [],
//公告验证 //公告验证
rules2: { rules2: {
NoticeName: [{ NoticeName: [{
...@@ -353,7 +374,7 @@ ...@@ -353,7 +374,7 @@
}] }]
}, },
//视频验证 //视频验证
rulesVideo:{ rulesVideo: {
video_url: [{ video_url: [{
required: true, required: true,
message: "请选择视频地址", message: "请选择视频地址",
...@@ -365,7 +386,6 @@ ...@@ -365,7 +386,6 @@
trigger: "change" trigger: "change"
}] }]
} }
}; };
}, },
components: { components: {
...@@ -374,50 +394,49 @@ ...@@ -374,50 +394,49 @@
chooseMeun, chooseMeun,
Choosevideo Choosevideo
}, },
created() { created() {
}, },
methods: { methods: {
//点击添加组件 //点击添加组件
addPlugn(item){ addPlugn(item) {
this.dataList.push(JSON.parse(JSON.stringify(item))); this.dataList.push(JSON.parse(JSON.stringify(item)));
}, },
//删除插件 //删除插件
delPlugn(index){ delPlugn(index) {
this.dataList.splice(index,1); this.dataList.splice(index, 1);
}, },
//编辑 //编辑
isShowDialog(item){ isShowDialog(item) {
switch(item.key){ switch (item.key) {
case 'home_nav': case 'home_nav':
this.isShowNav=true; this.isShowNav = true;
this.navMsg.row_num=item.row_num; this.navMsg.row_num = item.row_num;
break; break;
case 'notice': case 'notice':
this.isShowNotice=true; this.isShowNotice = true;
this.noticeMsg=item; this.noticeMsg = item;
break; break;
case 'topic': case 'topic':
this.isShowTotic=true; this.isShowTotic = true;
this.topicMsg=item; this.topicMsg = item;
break; break;
case 'coupon': case 'coupon':
this.isShowCoupon=true; this.isShowCoupon = true;
this. this.
break; break;
} }
}, },
//确定编辑 //确定编辑
sureNav(){ sureNav() {
this.dataList.forEach(x=>{ this.dataList.forEach(x => {
if(x.key=='home_nav'){ if (x.key == 'home_nav') {
x.row_num=this.navMsg.row_num; x.row_num = this.navMsg.row_num;
} }
}) })
this.isShowNav=false; this.isShowNav = false;
}, },
saveTopic(addMsg){ saveTopic(addMsg) {
//提交创建、修改表单 //提交创建、修改表单
this.$refs[addMsg].validate(valid => { this.$refs[addMsg].validate(valid => {
if (valid) { if (valid) {
...@@ -428,7 +447,7 @@ ...@@ -428,7 +447,7 @@
}); });
}, },
//保存领券 //保存领券
setCoupon(addMsg){ setCoupon(addMsg) {
//提交创建、修改表单 //提交创建、修改表单
this.$refs[addMsg].validate(valid => { this.$refs[addMsg].validate(valid => {
if (valid) { if (valid) {
...@@ -439,16 +458,16 @@ ...@@ -439,16 +458,16 @@
}); });
}, },
//保存领券 //保存领券
saveCoupon(){ saveCoupon() {
this.dataList.forEach(x=>{ this.dataList.forEach(x => {
if(x.key=='coupon'){ if (x.key == 'coupon') {
x.coupon_not_url=this.couopnMsg.coupon_not_url; x.coupon_not_url = this.couopnMsg.coupon_not_url;
x.coupon_url=this.couopnMsg.coupon_url; x.coupon_url = this.couopnMsg.coupon_url;
} }
}) })
}, },
//保存公告 //保存公告
saveNotice(addMsg){ saveNotice(addMsg) {
//提交创建、修改表单 //提交创建、修改表单
this.$refs[addMsg].validate(valid => { this.$refs[addMsg].validate(valid => {
if (valid) { if (valid) {
...@@ -458,38 +477,41 @@ ...@@ -458,38 +477,41 @@
} }
}); });
}, },
baocunNotice(){ baocunNotice() {
this.dataList.forEach(x=>{ this.dataList.forEach(x => {
if(x.key=='notice'){ if (x.key == 'notice') {
x.NoticeName=this.noticeMsg.NoticeName; x.NoticeName = this.noticeMsg.NoticeName;
x.NoticeContent=this.noticeMsg.NoticeContent; x.NoticeContent = this.noticeMsg.NoticeContent;
x.notice_bg_color=this.noticeMsg.notice_bg_color; x.notice_bg_color = this.noticeMsg.notice_bg_color;
x.notice_text_color=this.noticeMsg.notice_text_color; x.notice_text_color = this.noticeMsg.notice_text_color;
x.notice_url=this.noticeMsg.notice_url; x.notice_url = this.noticeMsg.notice_url;
} }
}) })
}, },
//确定保存专题 //确定保存专题
setTopic(){ setTopic() {
this.dataList.forEach(x=>{ this.dataList.forEach(x => {
if(x.key=='topic'){ if (x.key == 'topic') {
x.topic_num=this.topicMsg.topic_num; x.topic_num = this.topicMsg.topic_num;
x.topic_url=this.topicMsg.topic_url; x.topic_url = this.topicMsg.topic_url;
x.topic_url_2=this.topicMsg.topic_url_2; x.topic_url_2 = this.topicMsg.topic_url_2;
} }
}) })
}, },
GetMiniProgramMallIndex() { GetMiniProgramMallIndex() {
this.apipost("/api/Tenant/GetMiniProgramMallIndex", {}, res => { this.apipost("/api/Tenant/GetMiniProgramMallIndex", {}, res => {
if (res.data.resultCode == 1) { if (res.data.resultCode == 1) {
this.ListData=res.data.data; this.PlusInData = res.data.data.PlusInData;
if (res.data.data.HomeDataList && res.data.data.HomeDataList.length > 0) {
this.dataList= res.data.data.HomeDataList;;
}
} else { } else {
this.Info(res.data.message); this.Info(res.data.message);
} }
}) })
}, },
//保存视频 //保存视频
saveVideo(addMsg){ saveVideo(addMsg) {
//提交创建、修改表单 //提交创建、修改表单
this.$refs[addMsg].validate(valid => { this.$refs[addMsg].validate(valid => {
if (valid) { if (valid) {
...@@ -499,22 +521,22 @@ ...@@ -499,22 +521,22 @@
} }
}); });
}, },
baocunVideo(){ baocunVideo() {
this.dataList[this.comCkVideo].video_url=this.videoMsg.video_url; this.dataList[this.comCkVideo].video_url = this.videoMsg.video_url;
this.dataList[this.comCkVideo].video_pic_url=this.videoMsg.video_pic_url; this.dataList[this.comCkVideo].video_pic_url = this.videoMsg.video_pic_url;
this.isShowVideo=false; this.isShowVideo = false;
this.videoMsg.video_pic_url=''; this.videoMsg.video_pic_url = '';
this.videoMsg.video_url=''; this.videoMsg.video_url = '';
}, },
//选择图片 //选择图片
SelectId(msg) { SelectId(msg) {
if (this.chooseImg =='topicOne') { if (this.chooseImg == 'topicOne') {
this.topicMsg.topic_url = msg.url; this.topicMsg.topic_url = msg.url;
} }
if(this.chooseImg =='topicTwo'){ if (this.chooseImg == 'topicTwo') {
this.topicMsg.topic_url_2 = msg.url; this.topicMsg.topic_url_2 = msg.url;
} }
if(this.chooseImg=='video'){ if (this.chooseImg == 'video') {
this.videoMsg.video_pic_url = msg.url; this.videoMsg.video_pic_url = msg.url;
} }
this.choicImg = false; this.choicImg = false;
...@@ -523,8 +545,22 @@ ...@@ -523,8 +545,22 @@
this.videoMsg.video_url = val.Path; this.videoMsg.video_url = val.Path;
this.isChoiceVideo = false; this.isChoiceVideo = false;
}, },
//保存数据
SaveHomeData() {
var msg = {
MallBaseId: this.getLocalStorage().MallBaseId,
HomeDataList: this.dataList
};
console.log("msg", msg);
this.apipost("/api/Tenant/SetMiniProgramMallHome", msg, res => {
if (res.data.resultCode == 1) {
this.Success(res.data.message);
this.GetMiniProgramMallIndex();
} else {
this.Info(res.data.message);
}
})
}
}, },
mounted() { mounted() {
this.GetMiniProgramMallIndex(); this.GetMiniProgramMallIndex();
...@@ -533,15 +569,16 @@ ...@@ -533,15 +569,16 @@
</script> </script>
<style> <style>
.module-icon { .module-icon {
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
width: 20px; width: 20px;
height: 20px; height: 20px;
cursor: pointer; cursor: pointer;
} }
.HomePage .module-name {
.HomePage .module-name {
font-size: 12px; font-size: 12px;
position: absolute; position: absolute;
top: 0; top: 0;
...@@ -550,17 +587,20 @@ ...@@ -550,17 +587,20 @@
background: rgba(0, 0, 0, .2); background: rgba(0, 0, 0, .2);
color: #ffffff; color: #ffffff;
text-align: center; text-align: center;
} }
.HomePage .el-tabs__nav-scroll{
padding-left:20px; .HomePage .el-tabs__nav-scroll {
} padding-left: 20px;
.button-item { }
.button-item {
padding: 9px 25px; padding: 9px 25px;
position: absolute; position: absolute;
bottom: -52px; bottom: -52px;
left: 0; left: 0;
} }
.HomePage .home_Add{
.HomePage .home_Add {
height: 33px; height: 33px;
width: 33px; width: 33px;
border-radius: 50%; border-radius: 50%;
...@@ -568,30 +608,35 @@ ...@@ -568,30 +608,35 @@
color: rgb(128, 194, 105); color: rgb(128, 194, 105);
text-align: center; text-align: center;
line-height: 33px; line-height: 33px;
} }
.module-box .edit-box {
.module-box .edit-box {
height: 55px; height: 55px;
border-top: 1px dotted #eeeeee; border-top: 1px dotted #eeeeee;
color: blue; color: blue;
cursor: pointer; cursor: pointer;
padding: 0 20%; padding: 0 20%;
} }
.module-box .name-box {
.module-box .name-box {
height: 70px; height: 70px;
} }
.module-item-box {
.module-item-box {
width: 44%; width: 44%;
max-width: 160px; max-width: 160px;
height: 125px; height: 125px;
font-size: 16px; font-size: 16px;
margin: 5px 10px; margin: 5px 10px;
border: 1px solid #eeeeee; border: 1px solid #eeeeee;
} }
.HomePage .module-box { .HomePage .module-box {
height: auto; height: auto;
overflow: auto; overflow: auto;
padding: 5px 10px 20px; padding: 5px 10px 20px;
} }
.home_Content { .home_Content {
height: 100%; height: 100%;
position: relative; position: relative;
...@@ -640,11 +685,13 @@ ...@@ -640,11 +685,13 @@
height: 64px; height: 64px;
line-height: 88px; line-height: 88px;
} }
.HomePage .video_msg{
.HomePage .video_msg {
display: inline-block; display: inline-block;
white-space: nowrap; white-space: nowrap;
width: 100%; width: 100%;
overflow: hidden; overflow: hidden;
text-overflow:ellipsis; text-overflow: ellipsis;
} }
</style> </style>
...@@ -658,8 +658,8 @@ ...@@ -658,8 +658,8 @@
} }
}, },
catGoodsNumChange(catIndex) { catGoodsNumChange(catIndex) {
if (this.data.catList[catIndex].goodsNum > 30) { if (this.data.catList[catIndex].goodsNum > 3) {
this.data.catList[catIndex].goodsNum = 30; this.data.catList[catIndex].goodsNum = 3;
} }
if (this.data.catList[catIndex].goodsNum < 1) { if (this.data.catList[catIndex].goodsNum < 1) {
this.data.catList[catIndex].goodsNum = 1; this.data.catList[catIndex].goodsNum = 1;
......
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