Skip to content

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

修改

parent 3a2ca17b
Hide whitespace changes
Inline Side-by-side
Showing with 816 additions and 56 deletions
src/components/blindDate/activityInfo.vue
View file @ f9fa4085
......@@ -3,6 +3,7 @@
background: #fff;
width: 740px;
min-height: 500px;
margin-top:10px;
}
.activityTitle {
......@@ -137,9 +138,38 @@
color: #2d64b3;
}
.activeInfoMain {
width: 100%;
background-color: #f7f8fa;
margin-top: 10px;
padding: 15px;
border-radius: 10px;
font-size: 14px;
color: #333;
}
.activeSpace {
display: flex;
justify-content: space-between;
margin-bottom: 10px;
}
.active_LeftTitle {
width: 100px;
text-align: right;
}
.activeRightCon {
width: 140px;
text-align: left;
}
</style>
<template>
<div class="activityInfo">
<div class="head-title">
<span @click="CommonJump('recruitStick')" class="blue point">招募贴</span> / 招募贴详情
</div>
<div class="activityMain">
<div class="activityFlex">
<div class="active_NameLeft">
......@@ -150,13 +180,54 @@
<div class="aUserName">{{dataList.UserName}}</div>
</div>
<div>
<div class="activityTitle">{{dataList.ActivityTitle}}</div>
<div class="activityContent">
{{dataList.Content}}
<div class="activityTitle">
<template v-if="labelArr&&labelArr.length>0">
<el-tag v-for="(tag,index) in labelArr" size="mini" :key="index">
{{tag}}
</el-tag>
</template>
<span style="margin-left:5px;">{{dataList.ActivityTitle}}</span>
</div>
<div class="activityContent" v-html="dataList.Content"></div>
<div style="display:flex;justify-content:space-between;margin-bottom:10px;">
<div class="commonDate">回复数：{{dataList.ReplyNum}}</div>
<div class="commonDate">{{dataList.CreateDate}}</div>
</div>
<div class="activeImgContent" v-for="(item,index) in dataList.ImageList" :key="index">
<img :src="item" alt="" />
</div>
<div class="activeInfoMain">
<div class="activeSpace">
<div style="display:flex;">
<div class="active_LeftTitle">是否开启报名：</div>
<div class="activeRightCon">{{dataList.IsOpenEnroll==1?'是':'否'}}</div>
</div>
<div style="display:flex;">
<div class="active_LeftTitle">截止报名日期：</div>
<div class="activeRightCon">{{dataList.Deadline}}</div>
</div>
</div>
<div class="activeSpace">
<div style="display:flex;">
<div class="active_LeftTitle">活动开始时间：</div>
<div class="activeRightCon">{{dataList.StartTime}}</div>
</div>
<div style="display:flex;">
<div class="active_LeftTitle">活动结束时间：</div>
<div class="activeRightCon">{{dataList.EndTime}}</div>
</div>
</div>
<div class="activeSpace">
<div style="display:flex;">
<div class="active_LeftTitle">男数量：</div>
<div class="activeRightCon">{{dataList.ManNum}}</div>
</div>
<div style="display:flex;">
<div class="active_LeftTitle">女数量：</div>
<div class="activeRightCon">{{dataList.WoManNum}}</div>
</div>
</div>
</div>
</div>
</div>
<div>
......@@ -173,6 +244,9 @@
<div class="activityContent" style="margin-top:0;">
{{subItem.Content}}
</div>
<div style="text-align:right;margin-bottom:10px;">
<span class="commonDate">{{subItem.CreateDate}}</span>
</div>
<div class="activeImgContent" v-for="(item,index) in subItem.ImageList" :key="index">
<img :src="item" alt="" />
</div>
......@@ -202,8 +276,8 @@
<img src="../../assets/img/userman/del.png" alt="" />
</div>
</div>
<el-pagination style="text-align:center" background @current-change="handleCurrentChange" :page-size="comMsg.pageSize"
layout="prev, pager, next" :total="pageCount">
<el-pagination style="text-align:center" background @current-change="handleCurrentChange"
:page-size="comMsg.pageSize" layout="prev, pager, next" :total="pageCount">
</el-pagination>
</div>
</div>
......@@ -222,7 +296,11 @@
<div class="activityContent" style="margin-top:0;">
{{replyObj.Content}}
</div>
<div class="activeImgContent" v-if="replyObj.ImageList.length>0" v-for="(Iitem,Iindex) in replyObj.ImageList" :key="Iindex">
<div style="text-align:right;margin-bottom:10px;">
<span class="commonDate">{{replyObj.CreateDate}}</span>
</div>
<div class="activeImgContent" v-if="replyObj.ImageList.length>0" v-for="(Iitem,Iindex) in replyObj.ImageList"
:key="Iindex">
<img :src="Iitem" alt="" />
</div>
<div class="activeComment">
......@@ -243,14 +321,15 @@
<img src="../../assets/img/userman/del.png" alt="" />
</div>
</div>
<el-pagination style="text-align:center;padding:0;margin-top:15px;" background @current-change="handleCurrentReplay" :page-size="replayMsg.pageSize"
layout="prev, pager, next" :total="replayCount">
<el-pagination style="text-align:center;padding:0;margin-top:15px;" background
@current-change="handleCurrentReplay" :page-size="replayMsg.pageSize" layout="prev, pager, next"
:total="replayCount">
</el-pagination>
</div>
</div>
</div>
<span slot="footer" class="dialog-footer">
<el-button type="primary" size="small" @click="showCompoent = false">确定</el-button>
<el-button type="danger" size="small" @click="showCompoent = false">取消</el-button>
</span>
</el-dialog>
......@@ -277,10 +356,11 @@
dataList: {},
compentList: [],
pageCount: 0,
replayCount:0,
replayCount: 0,
replayList: [],
showCompoent: false, //显示评论弹窗
replyObj:{}
replyObj: {},
labelArr: [], //标签数组
}
},
created() {},
......@@ -298,6 +378,10 @@
this.apipost("/api/Miai/GetActivityInfo", this.msg, res => {
if (res.data.resultCode == 1) {
this.dataList = res.data.data;
this.labelArr = [];
if(this.dataList.Label){
this.labelArr.push(this.dataList.Label);
}
} else {
this.Error(res.data.message);
}
......@@ -320,7 +404,7 @@
this.getCommentList();
},
//回复翻页
handleCurrentReplay(val){
handleCurrentReplay(val) {
this.replayMsg.pageIndex = val;
this.getSecondReply();
},
......@@ -359,8 +443,8 @@
});
},
//点击更多评论
getCompentItem(item){
this.showCompoent=true;
getCompentItem(item) {
this.showCompoent = true;
this.replyObj = item;
this.replayMsg.ParentId = item.Id;
this.getSecondReply();
......
src/components/blindDate/blindDateIndex.vue
View file @ f9fa4085
......@@ -59,6 +59,7 @@
width: 100%;
height: 100%;
background-color: #f3f3f3;
overflow: hidden;
}
.blindDateIndex .mainRightTop {
......
src/components/blindDate/recruitStick.vue
View file @ f9fa4085
......@@ -15,6 +15,10 @@
-webkit-box-orient: vertical;
}
.recruitContent img {
width: 40px;
}
</style>
<template>
<div class="recruitStick">
......@@ -33,38 +37,62 @@
</div>
<div style="padding: 20px;background: #fff;">
<el-table :data="tableData" header-cell-class-name="headClass" style="width: 100%" border>
<el-table-column prop="Id" label="ID" width="100">
<el-table-column prop="Id" label="ID" width="60">
</el-table-column>
<el-table-column prop="ActivityTitle" label="标题">
<el-table-column prop="ActivityTitle" label="标题" min-width="200">
</el-table-column>
<el-table-column prop="UserName" label="用户名称">
<el-table-column prop="UserName" label="用户信息" width="200">
<template slot-scope="scope">
<div style="display:flex;align-items:center;">
<img :src="scope.row.Photo" style="width:35px;height:35px;border-radius:50%;" />
<span style="display:inline-block;margin-left:5px;">{{scope.row.UserName}}</span>
</div>
</template>
</el-table-column>
<el-table-column prop="Photo" label="头像">
<el-table-column prop="ImageList" label="图片" width="80">
<template slot-scope="scope">
<img :src="scope.row.Photo" style="width:35px;height:35px;border-radius:50%;" />
<img v-for="(item,index) in scope.row.ImageList" style="width:50px;" :key="index" :src="item" />
</template>
</el-table-column>
<el-table-column prop="Content" label="内容">
<el-table-column prop="ReplyNum" label="回复数量" width="80">
</el-table-column>
<el-table-column prop="EnrollNum" label="报名人数" width="80">
</el-table-column>
<el-table-column prop="EnrollNum" label="是否开启报名" width="120">
<template slot-scope="scope">
<div class="recruitContent">{{scope.row.Content}}</div>
<span v-if="scope.row.IsOpenEnroll==1" style="color:green">是</span>
<span v-if="scope.row.IsOpenEnroll==2" style="color:red">否</span>
</template>
</el-table-column>
<!-- <el-table-column prop="ImageList" label="图片">
</el-table-column> -->
<el-table-column prop="ReplyNum" label="回复数量">
<el-table-column label="标签" width="70">
<template slot-scope="scope" v-if="scope.row.Label">
<el-tag>
{{scope.row.Label}}
</el-tag>
</template>
</el-table-column>
<el-table-column prop="Deadline" label="截止报名日期">
<el-table-column label="活动时间" width="220">
<template slot-scope="scope">
<div>开始时间：{{scope.row.StartTime}}</div>
<div>结束时间：{{scope.row.EndTime}}</div>
</template>
</el-table-column>
<el-table-column prop="ManNum" label="男数量" width="70">
</el-table-column>
<el-table-column fixed="right" label="操作" width="180">
<el-table-column prop="WoManNum" label="女数量" width="70">
</el-table-column>
<el-table-column prop="Deadline" label="截止报名日期" width="150">
</el-table-column>
<el-table-column fixed="right" label="操作" width="130">
<template slot-scope="scope">
<el-tooltip class="item" effect="dark" content="删除" placement="top">
<img src="../../assets/img/setup/del.png" alt="" class="imgstyle" @click="delete_b(scope.row)">
<el-tooltip class="item" effect="dark" content="查看详情" placement="top">
<img src="../../assets/img/userman/icon-show.png" alt="" class="imgstyle" @click="goDetail(scope.row)">
</el-tooltip>
<el-tooltip class="item" effect="dark" content="报名列表" placement="top">
<img src="../../assets/img/userman/order.png" alt="" class="imgstyle" @click="goorderList(scope.row)">
</el-tooltip>
<el-tooltip class="item" effect="dark" content="查看详情" placement="top">
<img src="../../assets/img/userman/icon-show.png" alt="" class="imgstyle" @click="goDetail(scope.row)">
<el-tooltip class="item" effect="dark" content="删除" placement="top">
<img src="../../assets/img/setup/del.png" alt="" class="imgstyle" @click="delete_b(scope.row)">
</el-tooltip>
</template>
</el-table-column>
......@@ -136,24 +164,24 @@
});
},
//招募贴报名列表
goorderList(item){
goorderList(item) {
this.$router.push({
name: 'registrationList',
query: {
Id:item.Id,
blank: "y"
}
});
name: 'registrationList',
query: {
Id: item.Id,
blank: "y"
}
});
},
//查看详情
goDetail(item){
goDetail(item) {
this.$router.push({
name: 'activityInfo',
query: {
Id:item.Id,
blank: "y"
}
});
name: 'activityInfo',
query: {
Id: item.Id,
blank: "y"
}
});
}
},
}
......
src/components/blindDate/registrationList.vue
View file @ f9fa4085
......@@ -18,7 +18,10 @@
</style>
<template>
<div class="recruitStick">
<div style="padding: 20px;background: #fff;">
<div class="head-title">
<span @click="CommonJump('recruitStick')" class="blue point">招募贴</span> / 报名列表
</div>
<div style="margin-top:10px;padding: 20px;background: #fff;">
<el-table :data="tableData" header-cell-class-name="headClass" style="width: 100%" border>
<el-table-column prop="Name" label="姓名">
<template slot-scope="scope">
......
src/components/blindDate/starsList.vue
View file @ f9fa4085
......@@ -6,7 +6,7 @@
<el-button type="primary" class="el-button--small" @click="addRecharge">新增</el-button>
</div>
</div>
<div style="padding: 20px;background: #fff;margin-top: 20px">
<div style="padding: 20px;background: #fff;margin-top: 10px">
<el-table :data="tableData" header-cell-class-name="headClass" style="width: 100%" border>
<el-table-column prop="ID" label="ID" width="100">
</el-table-column>
......@@ -23,8 +23,8 @@
</el-table-column>
<el-table-column prop="IsGive" label="是否赠送星星数">
<template slot-scope="scope">
<el-tag v-if="scope.row.IsGive==0" type="info">不赠送</el-tag>
<el-tag v-if="scope.row.IsGive>0" type="warning">赠送{{scope.row.GivePoint}}星星数</el-tag>
<el-tag v-if="scope.row.IsGive==0" size="small" type="info">不赠送</el-tag>
<el-tag v-if="scope.row.IsGive>0" size="small" type="warning">赠送{{scope.row.GivePoint}}星星数</el-tag>
</template>
</el-table-column>
<el-table-column fixed="right" label="操作" width="180">
......
src/components/sallCenter/plugin/educationCustom.vue
View file @ f9fa4085
......@@ -231,7 +231,7 @@
</div>
<div class="diy-goods">
<div class="diy-component-preview"
:style="{'backgroundColor':data.backgroundColor,'borderRadius':data.SearchFilletPX+'px'}">
:style="{'backgroundColor':data.backgroundColor}">
<div :flex="cMainFlex" :style="{marginLeft:data.PaddingLeft+'px',
marginRight:data.PaddingRight+'px',marginTop:data.PaddingTop+'px',
marginBottom:data.PaddingBottom+'px'}">
......@@ -241,15 +241,15 @@
<div v-for="(goods,goodsIndex) in cCatGoodsList(cat, catIndex)" class="goods-item" :key="goodsIndex"
:class="data.catPosition==='left'?'goods-cat-list':''">
<div style="display: inline-block;" :style="cGoodsItemWidth">
<div :style="{'borderRadius':data.SearchFilletPX+'px'}" :flex="cGoodsItemFlex" style="position: relative;border:1px solid rgb(226, 226, 226)">
<div :style="{'borderRadius':data.SearchFilletPX+'px'}" :flex="cGoodsItemFlex" style="position: relative;border:1px solid rgb(226, 226, 226);overflow:hidden">
<div class="goods-pic"
:class="'goods-pic-'+data.goodsCoverProportion+' goods-pic-fill-'+data.fill"
:style="'background-image: url('+getIconLink(goods.picUrl)+')'">
</div>
<div :style="cGoodsItemInfoStyle">
<div class="goods-name" :class="data.listStyle===-1?'goods-name-static':''">
<div style="font-size:16px;">{{goods.name}}</div>
<div style="font-size:14px;margin-top:10px;">{{goods.lableName}}</div>
<div style="font-size:30px;">{{goods.name}}</div>
<div style="font-size:25px;margin-top:10px;">{{goods.lableName}}</div>
</div>
</div>
</div>
......@@ -475,7 +475,7 @@
linkUrl:'' //链接
}
if(this.data.list.length<this.data.goodsLength){
if(this.data.list.length>0){
// if(this.data.list.length>0){
for(var i=0;i<this.data.list.length;i++){
if(this.data.list[i].linkUrl==''){
this.Error(`请选择第${i+1}个的链接`);
......@@ -483,7 +483,7 @@
}
}
this.data.list.push(obj);
}
// }
}else{
this.Error('超出自定义数量');
}
......
src/components/sallCenter/plugin/miaiactiviCustom.vue 0 → 100644
View file @ f9fa4085
<style>
/*-----------------设置部分--------------*/
.diy-goods .diy-component-edit .diy-goods-label {
width: 85px;
}
.diy-goods .diy-component-edit .cat-item {
border: 1px solid #e2e2e2;
margin-bottom: 5px;
padding: 15px;
max-width: 400px;
}
.diy-goods .diy-component-edit .goods-list {
flex-wrap: wrap;
}
.diy-goods .diy-component-edit .goods-pic {
width: 100%;
height: 100%;
background-size: cover;
background-position: center;
}
.diy-goods .diy-component-edit .goods-delete {
position: absolute;
left: calc(100% - 10px);
top: -10px;
width: 20px;
height: 20px;
line-height: 20px;
padding: 0 0;
visibility: hidden;
z-index: 1;
}
.diy-goods .diy-component-edit .goods-item:hover .goods-delete {
visibility: visible;
}
/*-----------------预览部分--------------*/
.diy-goods .diy-component-preview .goods-list {
padding: 11px;
}
.diy-goods .diy-component-preview .goods-item {
padding: 11px;
}
.diy-goods .diy-component-preview .goods-pic {
background-size: cover;
background-position: center;
width: 99.8%;
height: 700px;
background-color: #f6f6f6;
background-repeat: no-repeat;
position: relative;
border-radius: 10px 10px 0 0;
}
.diy-goods .diy-component-preview .goods-name {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
margin-bottom: 10px;
}
.diy-goods .diy-component-preview .goods-name-static {
height: 94px;
}
.diy-goods .diy-component-preview .goods-price {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
color: #ff4544;
line-height: 48px;
}
.diy-goods .diy-component-preview .goods-list-style--1 .goods-item,
.diy-goods .diy-component-preview .goods-list-style-1 .goods-item {
width: 100%;
}
.diy-goods .diy-component-preview .goods-list-style-2 .goods-item {
width: 50%;
}
.diy-goods .diy-component-preview .goods-list-style-3 .goods-item {
width: 33.333333%;
}
.diy-goods .diy-component-preview .goods-list-style-0 .goods-item {
width: 249px;
}
.diy-goods .diy-component-preview .goods-list-style--1 .goods-pic {
width: 200px;
height: 200px;
border-radius: 10px 0 0 10px;
}
.diy-goods .diy-component-preview .goods-list-style-2 .goods-pic {
height: 342px;
border-radius: 10px 10px 0 0;
}
.diy-goods .diy-component-preview .goods-list-style-0 .goods-pic,
.diy-goods .diy-component-preview .goods-list-style-3 .goods-pic {
height: 200px;
border-radius: 10px 10px 0 0;
}
.diy-goods .diy-component-preview .goods-pic-fill-0 {
background-size: contain;
}
.diy-goods .diy-component-preview .buy-btn {
border-color: #ff4544;
color: #ff4544;
padding: 0 20px;
height: 48px;
line-height: 50px;
font-size: 24px;
}
.diy-goods .diy-component-preview .buy-btn.el-button--primary {
background-color: #ff4544;
color: #fff;
}
.diy-goods .diy-component-preview .goods-tag {
position: absolute;
top: 0;
left: 0;
width: 64px;
height: 64px;
z-index: 1;
background-size: 100% 100%;
background-position: center;
background-repeat: no-repeat;
}
.diy-goods hr {
border: none;
height: 1px;
background-color: #e2e2e2;
}
.diy-goods .goods-item.goods-cat-list {
border-top: 1px solid #e2e2e2;
}
.diy-goods .goods-item.goods-cat-list:first-of-type {
border-top: 0;
}
.diy-goods .cat-list {
max-height: 500px;
overflow: auto;
}
.goodsDialog .el-dialog__body {
padding: 10px 20px;
}
.education-edit-item {
border: 1px solid #dcdfe6;
padding: 5px;
margin-bottom: 5px;
position: relative;
}
.education_image_upload .pic-box {
width: 70px;
height: 70px;
border: 1px solid #ccc;
cursor: pointer;
background-color: #fff;
background-size: contain;
background-position: center;
background-repeat: no-repeat;
position: relative;
}
.education-edit-options .el-button {
height: 25px;
line-height: 25px;
width: 25px;
padding: 0;
text-align: center;
border: none;
border-radius: 0;
position: absolute;
margin-left: 0;
}
.education_image_upload .pic-box .size-tip {
line-height: 1.35;
text-align: center;
position: absolute;
bottom: 0;
left: 0;
width: 100%;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
font-size: 12px;
color: #fff;
background: rgba(0, 0, 0, 0.2);
letter-spacing: -1px;
}
.education_image_upload .image-delete {
position: absolute;
top: -10px;
right: -10px;
padding: 5px;
visibility: hidden;
z-index: 1;
}
.education_image_upload:hover .image-delete {
visibility: visible;
}
</style>
<template>
<div :class="{'active':mcData.isCked}">
<div class="diy-component-options" v-if="mcData.isCked">
<el-button type="primary" icon="el-icon-delete" style="left: -25px; top: 0px;" @click="delPlugin()"></el-button>
<el-button type="primary" icon="el-icon-document-copy" style="left: -25px; top: 30px;"></el-button>
<el-button type="primary" icon="el-icon-arrow-up" v-if="index>0" @click="resetSord(0)"
style="right: -25px; top: 0;"></el-button>
<el-button type="primary" icon="el-icon-arrow-down" v-if="index!=dataLeng-1" @click="resetSord(1)"
style="right: -25px; top: 30px;"></el-button>
</div>
<div class="diy-goods">
<div class="diy-component-preview"
:style="{'backgroundColor':data.backgroundColor}">
<div :flex="cMainFlex" :style="{marginLeft:data.PaddingLeft+'px',
marginRight:data.PaddingRight+'px',marginTop:data.PaddingTop+'px',
marginBottom:data.PaddingBottom+'px'}">
<div class="goods-list" :class="'goods-list-style-'+data.listStyle">
<div v-for="(cat,catIndex) in cCatList" :key="catIndex">
<div :style="cGoodsListStyle" flex>
<div v-for="(goods,goodsIndex) in cCatGoodsList(cat, catIndex)" class="goods-item" :key="goodsIndex"
:class="data.catPosition==='left'?'goods-cat-list':''">
<div style="display: inline-block;" :style="cGoodsItemWidth">
<div :style="{'borderRadius':data.SearchFilletPX+'px'}" :flex="cGoodsItemFlex" style="position: relative;border:1px solid rgb(226, 226, 226);overflow:hidden;">
<div class="goods-pic"
:class="'goods-pic-'+data.goodsCoverProportion+' goods-pic-fill-'+data.fill"
:style="'background-image: url('+getIconLink(goods.picUrl)+')'">
</div>
<div :style="cGoodsItemInfoStyle">
<div class="goods-name" :class="data.listStyle===-1?'goods-name-static':''">
<div style="font-size:30px;">{{goods.name}}</div>
<div style="font-size:25px;margin-top:10px;">{{goods.lableName}}</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="diy-component-edit" v-if="mcData.isCked">
<el-form label-width='150px' @submit.native.prevent>
<template>
<el-form-item label="自定义数量">
<el-input size="small" v-model.number="data.goodsLength" type="number"></el-input>
</el-form-item>
<el-form-item label="自定义列表">
<div flex="dir:top">
<div class="education-edit-item" v-for="(item,index) in data.list" :key="index">
<div class="education-edit-options">
<el-button type="primary" icon="el-icon-delete" @click="delBanner(index)"
style="position:absolute;top: -1px; right: -26px;"></el-button>
</div>
<div flex="box:first">
<div>
<div class="education_image_upload" style="margin:5px 5px 0 0;">
<div flex="main:center cross:center" @click="choiceMyImg(index)" class="pic-box"
:style="{backgroundImage:'url(' + getIconLink(item.picUrl) + ')'}">
<i style="font-size:22px;color:#909399;" class="el-icon-picture-outline"
v-if="item.picUrl==''"></i>
<div class="size-tip">720 × 250</div>
<el-button type="danger" v-if="item.picUrl!=''" class="image-delete" size="mini"
icon="el-icon-close" @click.stop="item.picUrl=''" circle></el-button>
</div>
</div>
</div>
<div>
<div>
<el-input type="text" v-model="item.name" placeholder="标题" size="small" style="margin-bottom:5px;"></el-input>
<el-input type="text" v-model="item.lableName" placeholder="副标题" size="small" style="margin-bottom:5px;"></el-input>
<el-input type="text" v-model="item.linkUrl" placeholder="点击选择链接" size="small">
<el-button slot="append" @click="getMyChoice(index)">选择链接</el-button>
</el-input>
</div>
</div>
</div>
</div>
</div>
<el-button size="small" @click="addBanner()">添加自定义</el-button>
</el-form-item>
</template>
<hr>
<el-form-item label="列表样式">
<el-radio v-model="data.listStyle" :label="-1">列表模式</el-radio>
<el-radio v-model="data.listStyle" :label="0">左右滑动</el-radio>
<el-radio v-model="data.listStyle" :label="1">一行一个</el-radio>
<el-radio v-model="data.listStyle" :label="2">一行两个</el-radio>
</el-form-item>
<el-form-item label="背景颜色">
<div class="input-color" flex="dir:left cross:center">
<el-color-picker size="small" v-model="data.backgroundColor"></el-color-picker>
<el-input size="small" style="width: 80px;margin-right: 25px;" v-model="data.backgroundColor"></el-input>
</div>
</el-form-item>
<el-form-item label="上边距">
<el-input type="number" size="small" :min="0" v-model="data.PaddingTop">
<template slot="append">px</template>
</el-input>
</el-form-item>
<el-form-item label="下边距">
<el-input type="number" size="small" :min="0" v-model="data.PaddingBottom">
<template slot="append">px</template>
</el-input>
</el-form-item>
<el-form-item label="左边距">
<el-input type="number" size="small" :min="0" v-model="data.PaddingLeft">
<template slot="append">px</template>
</el-input>
</el-form-item>
<el-form-item label="右边距">
<el-input type="number" size="small" :min="0" v-model="data.PaddingRight">
<template slot="append">px</template>
</el-input>
</el-form-item>
<el-form-item label="圆角">
<el-input type="number" size="small" :min="0" v-model="data.SearchFilletPX">
<template slot="append">px</template>
</el-input>
</el-form-item>
</el-form>
</div>
</div>
<!-- 选择图片文件 -->
<el-dialog title="选择文件" :visible.sync="choicImg" width="1240px">
<ChooseImg @SelectId="SelectId"></ChooseImg>
</el-dialog>
<!-- 选择商品 -->
<el-dialog title="选择商品" :visible.sync="isShowGoods" custom-class="goodsDialog">
<choiceGood ref="choiceGood"></choiceGood>
<span slot="footer" class="dialog-footer">
<el-button size="small" @click="isShowGoods=false">取 消</el-button>
<el-button size="small" type="danger" @click="getGoodsChoice()">确 定</el-button>
</span>
</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 ChooseImg from "@/components/global/ChooseImg.vue";
import choiceGood from "../../common/choiceGood.vue";
import chooseMenu from "../../common/chooseMenu.vue";
export default {
props: ["mcData", "index", "dataLeng"],
components: {
ChooseImg,
choiceGood,
chooseMenu
},
data() {
return {
//可以选择的商品数
ckGoods: 0,
data: this.mcData.data,
position: 'center center',
repeat: 'no-repeat',
choicImg: false,
isShowGoods: false,
//添加的下标
comIndex: -1,
commonIndex:0,
isShowLink:false,
};
},
created() {
},
methods: {
//向父组件传值 并调用排序
resetSord(IsUp) {
this.$emit('getSord', this.index, IsUp);
},
//点击触发父组件删除
delPlugin() {
this.$emit('comDelPlugin', this.index);
},
cCatGoodsList(cat, catIndex) {
const goodsList = cat.goodsList;
let newList = [];
if (catIndex > 0) {
newList = [];
} else {
if (goodsList && goodsList.length) {
newList = goodsList;
} else {
const defaultGoodsItem = {
id: 0,
name: '商品名称',
lableName:'',
picUrl: '',
linkUrl:'',
};
newList = new Array(cat.goodsNum).fill(defaultGoodsItem);
}
}
return newList;
},
//选择图片
SelectId(msg) {
this.data.list[this.commonIndex].picUrl=this.getIconLink(msg.url);
this.choicImg=false;
},
//选择商品
getGoodsChoice() {
var ckedArr = this.$refs.choiceGood.getChoicedGoods();
var myArray = [];
if (ckedArr && ckedArr.length > 0) {
ckedArr.forEach(element => {
myArray.push({
id: element.Id,
name: element.Name,
picUrl: element.CoverImage,
price: element.SellingPrice
});
});
}
if (this.comIndex !== null) {
} else {
this.data.list = this.data.list.concat(myArray);
}
this.isShowGoods = false;
this.$refs.choiceGood.toggleSelection();
},
//删除banner
delBanner(index){
this.data.list.splice(index,1);
},
//选取图片
choiceMyImg(index){
this.choicImg = true;
this.commonIndex=index;
},
//选择链接
getMyChoice(index){
this.isShowLink=true;
this.commonIndex=index;
},
//添加商品
addBanner(){
let obj={
id:0,
name:'', //标题
lableName:'', //副标题
picUrl:'', //商品图片
linkUrl:'' //链接
}
if(this.data.list.length<this.data.goodsLength){
// if(this.data.list.length>0){
for(var i=0;i<this.data.list.length;i++){
if(this.data.list[i].linkUrl==''){
this.Error(`请选择第${i+1}个的链接`);
return;
}
}
this.data.list.push(obj);
// }
}else{
this.Error('超出自定义数量');
}
},
//获取选择链接
getChoiceLink(){
//调用子组件方法
var obj = this.$refs.chooseMenu.getChooseMenu();
this.data.list[this.commonIndex].linkUrl=obj.PageUrl;
this.isShowLink = false;
},
},
computed: {
cMainFlex() {
if (this.data.catPosition === 'left') {
return 'dir:left box:first';
}
if (this.data.catPosition === 'top') {
return 'dir:top';
}
},
cCatFlex() {
if (this.data.catPosition === 'left') {
return 'dir:top';
}
if (this.data.catPosition === 'top') {
return 'dir:left';
}
},
cCatList() {
if (this.data.showCat) {
if (this.data.catList && this.data.catList.length) {
return this.data.catList;
} else {
const defaultCatItem = {
id: 0,
name: '分类名称',
menuName: '分类名称',
goodsList: [],
goodsNum: 3,
};
return [defaultCatItem, defaultCatItem];
}
} else {
return [{
id: null,
name: null,
menuName: null,
goodsList: this.data.list,
}];
}
},
cCatStyle() {},
cGoodsListStyle() {
if (this.data.listStyle === 0) {
return 'flex-wrap: nowrap;overflow-x:auto;';
} else {
return 'flex-wrap: wrap;';
}
},
cGoodsItemFlex() {
if (this.data.listStyle === -1) {
return 'dir:left box:first cross:center';
}
return 'dir:top';
},
cGoodsItemStyle() {
let style;
if (this.data.goodsStyle != 3) {
if (this.data.listStyle === -1) {
style = 'border: 1px solid #e2e2e2;border-radius:10px;background:#fff;'
} else {
style = 'border: 1px solid #e2e2e2;border-radius:10px;background:#fff;'
}
} else {
return style
}
if (this.data.goodsStyle === 2) {
return style
} else if (this.data.goodsStyle === 1) {
if (this.data.listStyle === -1) {
return 'border-radius:10px;background:#fff;'
} else {
return 'border-radius:10px;background:#fff;'
}
} else {
return 'background:#fff;';
}
},
cShowBuyBtn() {
if (!this.data.showBuyBtn) {
return false;
}
if (this.data.textStyle === 2 || this.data.listStyle === 0) {
return false;
}
return true;
},
cGoodsItemInfoStyle() {
let style = '';
if (this.data.textStyle === 2) {
style += `text-align: center;`;
}
if (this.data.listStyle === -1) {
style += `height: 200px;padding: 20px 24px 20px 32px;`;
} else {
style += `padding:24px 24px;`;
}
return style;
},
cGoodsItemWidth() {
if (this.data.listStyle === 0) {
return 'width: 200px;';
}
return 'width: 100%;';
},
cButtonStyle() {
let style =
`background: ${this.data.buttonColor};border-color: ${this.data.buttonColor};height:48px;line-height:46px;padding:0 20px;`;
if (this.data.buyBtnStyle === 3 || this.data.buyBtnStyle === 4) {
style += `border-radius:999px;`;
}
if (this.data.buyBtnStyle === 2 || this.data.buyBtnStyle === 4) {
style += `background:#fff;color:${this.data.buttonColor}`;
}
return style;
},
},
mounted() {
}
};
</script>
src/components/sallCenter/templateEdit.vue
View file @ f9fa4085
......@@ -302,6 +302,8 @@
:index="index" :dataLeng="dataList.length"></miaiuser>
<miaiactivitytype v-if="item.Id=='miaiactivitytype'" :mData="item" @getSord="getSord" @comDelPlugin="comDelPlugin"
:index="index" :dataLeng="dataList.length"></miaiactivitytype>
<miaiactiviCustom v-if="item.Id=='miaiactiviCustom'" :mcData="item" @getSord="getSord" @comDelPlugin="comDelPlugin"
:index="index" :dataLeng="dataList.length" ></miaiactiviCustom>
</div>
</div>
</div>
......@@ -419,6 +421,8 @@
import navPage from "../sallCenter/plugin/nav-page"
import miaiuser from "../sallCenter/plugin/miaiuser"
import miaiactivitytype from "../sallCenter/plugin/miaiactivitytype"
import miaiactiviCustom from "../sallCenter/plugin/miaiactiviCustom"
import ChooseImg from "@/components/global/ChooseImg.vue";
export default {
......@@ -497,7 +501,8 @@
educationteacher,
navPage,
miaiuser,
miaiactivitytype
miaiactivitytype,
miaiactiviCustom
},
methods: {
//选择图片
......@@ -1376,7 +1381,7 @@
}
this.dataList.push(zxObj);
break;
//自定义列表
//教育自定义
case 'educationCustom':
let customObj = {
Id: 'educationCustom',
......@@ -1531,6 +1536,25 @@
}
this.dataList.push(miaiactivityData);
break;
//相亲自定义
case 'miaiactiviCustom':
let miaiacObj = {
Id: 'miaiactiviCustom',
isCked: false,
data: {
goodsLength: 10, //商品数量
listStyle: -1, //列表样式[-1-列表模式,0-左右滑动,1-一行一个,2-一行两个3-一行三个]
backgroundColor: '#fff', //背景颜色
PaddingTop: 0, //上边距
PaddingBottom: 0, //下边距
PaddingLeft: 0, //左边距
PaddingRight: 0, //右边距
SearchFilletPX: 0, //组件圆角
list: [] //自定义列表
}
}
this.dataList.push(miaiacObj);
break;
}
},
//给子组件调用 重新排序上移下移
......
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