diff --git a/src/pages/exchangepage/couponTemplate/goodsPage/componentLib/main.js b/src/pages/exchangepage/couponTemplate/goodsPage/componentLib/main.js
index 43c93071..1a7c6a56 100644
--- a/src/pages/exchangepage/couponTemplate/goodsPage/componentLib/main.js
+++ b/src/pages/exchangepage/couponTemplate/goodsPage/componentLib/main.js
@@ -1,5 +1,6 @@
import React from "react";
import "./main.less";
+import Bus from '@/assets/eventBus.js'
let comPonentList=[{
id:1,
icon:'marketing-tupian',
@@ -8,12 +9,12 @@ let comPonentList=[{
},{
id:2,
icon:'marketing-beijingtupian',
- name:'backPicture',
+ name:'backgroundImg',
desc:'背景图'
},{
id:3,
icon:'marketing-sousuolan-',
- name:'searchBar',
+ name:'search',
desc:'搜索栏'
},{
id:4,
@@ -36,6 +37,7 @@ export default class componentLib extends React.Component {
componentWillUnmount() {}
propcomponentName(item){
this.props.componentName(item.name);
+ Bus.emit('componentLib',item)
}
render() {
return (
diff --git a/src/pages/exchangepage/couponTemplate/goodsPage/config/bottomBar.js b/src/pages/exchangepage/couponTemplate/goodsPage/config/bottomBar.js
index 6c2faa4a..e463f953 100644
--- a/src/pages/exchangepage/couponTemplate/goodsPage/config/bottomBar.js
+++ b/src/pages/exchangepage/couponTemplate/goodsPage/config/bottomBar.js
@@ -13,12 +13,12 @@ export default class edittemplate extends React.Component {
constructor(props) {
super(props)
this.state = {
- switch:false,
+ iswitch:false,
comType:1,
navlist:[
{
id:1,
- switch:false,
+ iswitch:true,
name:'index',
pic:{
show:'',
@@ -28,7 +28,7 @@ export default class edittemplate extends React.Component {
},
{
id:2,
- switch:false,
+ iswitch:true,
name:'order',
pic:{
show:'',
@@ -38,7 +38,7 @@ export default class edittemplate extends React.Component {
},
{
id:3,
- switch:false,
+ iswitch:true,
name:'coupon',
pic:{
show:'',
@@ -55,8 +55,8 @@ export default class edittemplate extends React.Component {
componentWillMount(e) {
let config = JSON.parse(sessionStorage.getItem('editorConfig'));
if (config && config.couponList && config.couponList.product_list) {
- let { navlist, defaultText, selectText, background } = config.couponList.product_list.bottomBar;
- this.setState({ navlist, defaultText, selectText, background });
+ let { navlist, defaultText, selectText, background,iswitch } = config.couponList.product_list.bottomBar;
+ this.setState({ navlist, defaultText, selectText, background,iswitch });
}
}
@@ -96,7 +96,7 @@ export default class edittemplate extends React.Component {
}
handleChangeStatus = (index,checked) => {
let model = this.state.navlist;
- model[index].switch= checked;
+ model[index].iswitch= checked;
this.setState({ navlist: model })
Bus.emit('navlist', model)
}
@@ -199,7 +199,7 @@ export default class edittemplate extends React.Component {
首页
显示
this.handleChangeStatus(0,checked)}
/>
@@ -254,7 +254,7 @@ export default class edittemplate extends React.Component {
订单
显示
this.handleChangeStatus(1,checked)}
/>
@@ -309,7 +309,7 @@ export default class edittemplate extends React.Component {
我的券
显示
this.handleChangeStatus(2,checked)}
/>
diff --git a/src/pages/exchangepage/couponTemplate/goodsPage/config/main.js b/src/pages/exchangepage/couponTemplate/goodsPage/config/main.js
index d6ca7f02..2f9060ad 100644
--- a/src/pages/exchangepage/couponTemplate/goodsPage/config/main.js
+++ b/src/pages/exchangepage/couponTemplate/goodsPage/config/main.js
@@ -292,7 +292,7 @@ export default class edittemplate extends React.Component {
- ) : this.props.componentName=='picture'?:this.props.componentName=='backPicture'?:this.props.componentName=='searchBar'?:this.props.componentName=='bottomBar'?:this.props.componentName=='title'?:null
+ ) : this.props.componentName=='picture'?:this.props.componentName=='backgroundImg'?:this.props.componentName=='search'?:this.props.componentName=='bottomBar'?:this.props.componentName=='title'?:null
}
)
diff --git a/src/pages/exchangepage/couponTemplate/goodsPage/config/picture.js b/src/pages/exchangepage/couponTemplate/goodsPage/config/picture.js
index 68eb3385..577b8dee 100644
--- a/src/pages/exchangepage/couponTemplate/goodsPage/config/picture.js
+++ b/src/pages/exchangepage/couponTemplate/goodsPage/config/picture.js
@@ -11,16 +11,19 @@ export default class edittemplate extends React.Component {
constructor(props) {
super(props)
this.state = {
+ iswitch:false,
img:'',
jumpType:'0',//0不跳转 1跳转
jumpUrl:''
}
}
componentWillMount(e) {
+
let config = JSON.parse(sessionStorage.getItem('editorConfig'));
if (config && config.couponList && config.couponList.product_list) {
- let {img,jumpType,jumpUrl}=config.couponList.product_list.picture;
- this.setState({ img,jumpType,jumpUrl });
+ let {img,jumpType,jumpUrl,iswitch}=config.couponList.product_list.picture;
+ console.log(21,config.couponList.product_list.picture);
+ this.setState({ img,jumpType,jumpUrl,iswitch});
}
}
diff --git a/src/pages/exchangepage/edittemplate/couponConfig/bottomBar.js b/src/pages/exchangepage/edittemplate/couponConfig/bottomBar.js
index 23c2ceae..1db98797 100644
--- a/src/pages/exchangepage/edittemplate/couponConfig/bottomBar.js
+++ b/src/pages/exchangepage/edittemplate/couponConfig/bottomBar.js
@@ -11,7 +11,7 @@ export default class bottomBar extends React.Component {
}
componentWillReceiveProps(nextProps){
let navList=nextProps.bottomBarConfig.navlist;
- let naVisual=navList.filter(item=>item.switch);
+ let naVisual=navList.filter(item=>item.iswitch);
this.setState({navList:naVisual});
console.log(66,nextProps);
}
diff --git a/src/pages/exchangepage/edittemplate/goodstemplate.js b/src/pages/exchangepage/edittemplate/goodstemplate.js
index f4948fcd..a6f8828d 100644
--- a/src/pages/exchangepage/edittemplate/goodstemplate.js
+++ b/src/pages/exchangepage/edittemplate/goodstemplate.js
@@ -4,44 +4,69 @@ import "../../../assets/comm.css"
import './goodstemplate.less'
import SearchBarView from './couponConfig/searchBar' //商品详情搜索栏
import BottomBarView from './couponConfig/bottomBar' //底部栏
+import {Sweetalert} from 'zent'
+import Bus from '@/assets/eventBus.js'
export default class edittemplate extends React.Component {
constructor(props) {
super(props)
this.state={
clientY:0,
- selectDom:'searchBar'
+ selectDom:'',
+ icon:''
}
}
opendescFn() {
this.props.opendesc(true)
}
- customComponent(e,name){
+ customComponent(e,name,icon){
//getBoundingClientRect().top ;获取div最顶边距离浏览器的位置
let b=this.refs[name];
let offset_top=this.refs[name].getBoundingClientRect().top;
- console.log(22,offset_top);
- this.setState({clientY:(offset_top-125),selectDom:name});
+ this.setState({clientY:(offset_top-125),selectDom:name,icon:icon});
+ if(name=='searchBar'){
+ this.setState({clientY:0});
+ }
if(name=='bottomBar'){
- this.setState({clientY:600,selectDom:name});
+ this.setState({clientY:600});
}
}
+ deleteFn(){
+ let selectDom=this.state.selectDom;//需删除组件名称
+ Sweetalert.confirm({
+ title:'确认信息',
+ content: 确认删除该模块?
,
+ onConfirm:()=>{
+ this.setState({selectDom:''});
+ Bus.emit('componentLibClose',selectDom)
+ },
+ onCancel:()=>{
+
+ },
+ parentComponent: this
+ });
+ }
+
render() {
let goodsConfig=this.props.goodsdata;
+ console.log(48,goodsConfig);
return (
{
- goodsConfig.search?
-
this.customComponent(e,'searchBar')} className={this.state.selectDom=='searchBar'?'selectBorder':''} ref="searchBar">
:null
+ goodsConfig.search&&goodsConfig.search.iswitch?
+
this.customComponent(e,'search','marketing-sousuolan-')} className={this.state.selectDom=='search'?'selectBorder':''} ref="search">
:null
}
{
!goodsConfig.top_image ?
:
}
{
- goodsConfig.picture?
this.customComponent(e,'picBar')} ref="picBar" className={this.state.selectDom=='picBar'?'selectBorder':''}>
:null
+ goodsConfig.picture&&goodsConfig.picture.iswitch?
this.customComponent(e,'picture','marketing-tupian')} ref="picture" className={this.state.selectDom=='picture'?'selectBorder':''}>
:null
}
{
- goodsConfig.title?
this.customComponent(e,'title')} ref="title" className={this.state.selectDom=='title'?'selectBorder':''}>
{goodsConfig.title.text}
:null
+ goodsConfig.title&&goodsConfig.title.iswitch?
this.customComponent(e,'title','marketing-fuwenbenkuang')} ref="title" className={this.state.selectDom=='title'?'selectBorder':''}>
{goodsConfig.title.text}
:null
+ }
+ {
+ goodsConfig.title&&goodsConfig.title.iswitch&&goodsConfig.title.text||goodsConfig.picture&&goodsConfig.picture.iswitch&&goodsConfig.picture.img?
:null
}
{
goodsConfig.list == 2 ?
: goodsConfig.list == 3 ?
:
@@ -56,14 +81,17 @@ export default class edittemplate extends React.Component {
goodsConfig.describe.type == 2 ?
: null
}
{
- goodsConfig.bottomBar?
this.customComponent(e,'bottomBar')} className={this.state.selectDom=='bottomBar'?'selectBottomBorder':''}>
:null
+ goodsConfig.bottomBar&&goodsConfig.bottomBar.iswitch?
this.customComponent(e,'bottomBar','marketing-list')} className={this.state.selectDom=='bottomBar'?'selectBottomBorder':''}>
:null
}
-
-
- |
- 删除
-
+ {
+ this.state.selectDom?
+
+ |
+ 删除
+
:null
+ }
+
)
}
diff --git a/src/pages/exchangepage/edittemplate/goodstemplate.less b/src/pages/exchangepage/edittemplate/goodstemplate.less
index f3f4a117..f6fc1aaa 100644
--- a/src/pages/exchangepage/edittemplate/goodstemplate.less
+++ b/src/pages/exchangepage/edittemplate/goodstemplate.less
@@ -20,15 +20,16 @@
height: 187px;
}
- >.content-title {
+ .content-title {
position: relative;
z-index: 999;
height: 40px;
line-height: 40px;
- margin-bottom: 50px;
padding: 0 13px;
}
-
+ .parting-line{
+ height: 50px;
+ }
>.goodsPic,
>.goodsPicMatrax {
width: 349px;
@@ -37,9 +38,6 @@
position: relative;
margin-top: -50px;
}
- >.goodsPic{
- margin-top: 8px;
- }
>.goodsPicMatrax {
height: auto;
}
diff --git a/src/pages/exchangepage/edittemplate/main.js b/src/pages/exchangepage/edittemplate/main.js
index 0c4fa199..782fa043 100644
--- a/src/pages/exchangepage/edittemplate/main.js
+++ b/src/pages/exchangepage/edittemplate/main.js
@@ -73,33 +73,35 @@ let couponProduct_list = {
button_color: '#FACD6A',
describe: { type: '', content: '', bg_image: '' },
picture: {
+ iswitch:false,
img: '',
jumpType: '0',//0不跳转 1跳转
jumpUrl: ''
},
backgroundImg: {
+ iswitch:false,
bgImg: ''
},
search: {
- switch: false,
+ iswitch: false,
shape: 'circular',
textAlign: 'left',
borderColor: '#333',
placeholder: '请输入关键字搜索'
},
title: {
- switch: false,
+ iswitch: false,
text: 'circular',
textAlign: 'left',
fontColor: '#333',
fontSize: 1
},
bottomBar: {
- switch:false,
+ iswitch:false,
navlist:[
{
id:1,
- switch:false,
+ iswitch:true,
name:'index',
pic:{
show:'',
@@ -109,7 +111,7 @@ let couponProduct_list = {
},
{
id:2,
- switch:false,
+ iswitch:true,
name:'order',
pic:{
show:'',
@@ -119,7 +121,7 @@ let couponProduct_list = {
},
{
id:3,
- switch:false,
+ iswitch:true,
name:'coupon',
pic:{
show:'',
@@ -167,6 +169,18 @@ export default class edittemplate extends React.Component {
this.setState({ model: val })
}
componentDidMount() {
+ //开启
+ Bus.addListener('componentLib', (prop) => {
+ let coupongoodsConfig = this.state.product_list
+ coupongoodsConfig[prop.name].iswitch= true
+ this.setState({ product_list: coupongoodsConfig })
+ })
+ //关闭
+ Bus.addListener('componentLibClose', (prop) => {
+ let coupongoodsConfig = this.state.product_list
+ coupongoodsConfig[prop].iswitch= false
+ this.setState({ product_list: coupongoodsConfig,componentOfconfig: '' })
+ })
Bus.addListener('picture', (prop) => {
let coupongoodsConfig = this.state.product_list
coupongoodsConfig.picture.img = prop
@@ -751,6 +765,7 @@ export default class edittemplate extends React.Component {
this.setState({ componentOfconfig: c });
}
render() {
+ console.log(761,this.state.product_list);
return (
@@ -861,7 +876,7 @@ export default class edittemplate extends React.Component {
}>
{
- this.state.product_list.search ?
: null
+ this.state.product_list.search&&this.state.product_list.search.iswitch ?
: null
}
)}
{
- this.state.product_list.picture ?
: null
+ this.state.product_list.picture&&this.state.product_list.picture.iswitch ?
: null
}
{
- this.state.product_list.title ?
{this.state.product_list.title.text}
: null
+ this.state.product_list.title&&this.state.product_list.title.iswitch ?
{this.state.product_list.title.text}
: null
+ }
+ {
+ this.state.product_list.title&&this.state.product_list.title.iswitch&&this.state.product_list.title.text||this.state.product_list.picture&&this.state.product_list.picture.iswitch&&this.state.product_list.picture.img?
:null
}
{this.state.product_list.list == 2 ? (
) : null}
{
- this.state.product_list.bottomBar?
:null
+ this.state.product_list.bottomBar&&this.state.product_list.bottomBar.iswitch? :null
}
diff --git a/src/pages/exchangepage/edittemplate/main.less b/src/pages/exchangepage/edittemplate/main.less
index 4ee0a026..5c031010 100644
--- a/src/pages/exchangepage/edittemplate/main.less
+++ b/src/pages/exchangepage/edittemplate/main.less
@@ -602,11 +602,12 @@
position: relative;
z-index: 999;
height: 20px;
- line-height:20px;
- margin-bottom: 20px;
padding:0 8px;
font-size: 8px;
}
+ .parting-line{
+ height:15px;
+ }
.searchBar{
transform: scale(0.8);
font-size: 10px;
@@ -656,7 +657,7 @@
position: relative;
margin-top: -20px;
}
-
+
.bottom_exchageBtn {
position: absolute;
bottom: 0;
@@ -742,6 +743,6 @@
#leftComponent .details-reduce{
transform: scale(0.5)
}
-button{
+.exchageBtn{
border: 0 !important;
}
\ No newline at end of file