From d94593cdcfd870b630c40fbdf8d1770be22db8ac Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E8=AE=B8=E7=BA=A2=E6=A2=85?= <1924913374@qq.com> Date: Fri, 2 Sep 2022 14:09:39 +0800 Subject: [PATCH] =?UTF-8?q?=E5=AE=8C=E6=88=90=E7=BC=96=E8=BE=91=E5=99=A8?= =?UTF-8?q?=E8=83=8C=E6=99=AF=E5=9B=BE=E8=81=94=E5=8A=A8?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../goodsPage/config/backPicture.js | 129 ++---------------- .../goodsPage/config/picture.js | 1 - .../edittemplate/goodstemplate.js | 2 +- .../edittemplate/goodstemplate.less | 3 +- src/pages/exchangepage/edittemplate/main.js | 13 +- src/pages/exchangepage/edittemplate/main.less | 1 - 6 files changed, 29 insertions(+), 120 deletions(-) diff --git a/src/pages/exchangepage/couponTemplate/goodsPage/config/backPicture.js b/src/pages/exchangepage/couponTemplate/goodsPage/config/backPicture.js index e208e396..8e9e6ed8 100644 --- a/src/pages/exchangepage/couponTemplate/goodsPage/config/backPicture.js +++ b/src/pages/exchangepage/couponTemplate/goodsPage/config/backPicture.js @@ -5,96 +5,34 @@ import Form from "@/components/form/main" import FormItem from "@/components/form-item/main" import { uploadImg, handelResponse } from "@/assets/api.js" import Ipt from "@/components/input/main" +import _ from "lodash"; +import Bus from '@/assets/eventBus.js' export default class edittemplate extends React.Component { constructor(props) { super(props) this.state = { - model: { - top_image: "", - list: "2", - font_color: "#f1f2f3", - button_color: "#FACD6A", - describe: { type: "", content: "", bg_image: '' } - } + bgimg:'' } } + componentWillMount(e) { let config = JSON.parse(sessionStorage.getItem('editorConfig')); if (config && config.couponList && config.couponList.product_list) { - this.setState({ model: config.couponList.product_list }); + let {bgimg}=config.couponList.product_list.backgroundImg; + this.setState({ bgimg}); } } - onListChange(e) { - let model = this.state.model; - model.list = e.target.value; - this.setState({ model: model }) - this.props.setarrayType(e.target.value); - } - - //活动说明 - onactivityChange(e) { - let model1 = this.state.model; - model1.describe.type = e.target.value; - this.setState({ model: model1 }) - this.props.setactiveType(e.target.value); - } - - hasItemFn(c) { - let model1 = this.state.model; - if (c == model1.describe.type) { - model1.describe.type = ''; - this.setState({ model: model1 }); - this.props.setactiveType(''); - } - } - //顶部banner onUploadChange(files) { if (files.length > 0 && files[0].status == "success") { - let model = this.state.model; - model.top_image = files[0].src; - this.setState({ model: model }) - this.props.setbanner(files[0].src); + this.setState({ bgimg: files[0].src }) + Bus.emit('bgImg', files[0].src) } else { - let model = this.state.model; - model.top_image = ''; - this.setState({ model: model }) - this.props.setbanner(""); + this.setState({ bgimg: ''}) + Bus.emit('bgImg','') } }; - //悬浮富文本 - getsusEditext(c) { - let model1 = this.state.model; - model1.describe.content = c; - this.setState({ model: model1 }); - this.props.seteditorHtml(c); - } - //富文本 - getEditext(c) { - let model1 = this.state.model; - model1.describe.content = c; - this.setState({ model: model1 }); - this.props.seteditorHtml(c); - } - - //底部描述图 - onUploadChange2(files) { - if (files.length > 0 && files[0].status == "success") { - let model1 = this.state.model; - model1.describe.bg_image = files[0].src; - this.setState({ model: model1 }) - this.props.setbottomImg(files[0].src); - } else { - let model1 = this.state.model; - model1.describe.bg_image = ''; - this.setState({ model: model1 }) - this.props.setbottomImg(""); - } - }; - - - onUploadError = (type, data) => { if (type === 'overMaxAmount') { Notify.error(`最多可上传 ${data.maxAmount} 张图片`); @@ -102,38 +40,6 @@ export default class edittemplate extends React.Component { Notify.error(`图片大小不能超过 ${data.formattedMaxSize}`); } }; - handleChange = (color) => { - let model1 = this.state.model; - model1.font_color = color; - this.setState({ - model: model1 - }); - this.props.setButtonbgcolor(color); - - } - handleChange1 = (color) => { - let model1 = this.state.model; - model1.button_color = color; - this.setState({ - model: model1 - }); - this.props.setButtoncolor(color); - } - - // 字体颜色 - fontcolor(cor) { - let models = this.state.model; - models.button_color = cor; - this.setState({ model: models }); - this.props.setButtoncolor(cor); - } - // 背景颜色 - bgcolor(cor) { - let models = this.state.model; - models.font_color = cor; - this.setState({ model: models }); - this.props.setButtonbgcolor(cor); - } onUpload = (file, report) => { let self = this; console.log('上传头像', file); @@ -180,18 +86,12 @@ export default class edittemplate extends React.Component { }); }; + componentWillUnmount() { let oldobj = JSON.parse(sessionStorage.getItem('editorConfig')); - if (oldobj && oldobj.couponList) { - let couponList = oldobj.couponList - couponList.product_list = this.state.model; + let couponList = oldobj.couponList; + couponList.product_list.backgroundImg = _.cloneDeep(this.state); oldobj.couponList = couponList; - } else { - oldobj = {} - let couponList = {} - couponList.product_list = this.state.model; - oldobj.couponList = couponList; - } sessionStorage.setItem('editorConfig', JSON.stringify(oldobj)); } render() { @@ -200,7 +100,6 @@ export default class edittemplate extends React.Component {

背景图设置

-
@@ -213,7 +112,7 @@ export default class edittemplate extends React.Component { tips="单张图片不超过 5M" onChange={(e) => { this.onUploadChange(e) }} onUpload={this.onUpload} - defaultFileList={this.state.model.top_image ? [{ 'src': this.state.model.top_image }] : null} + defaultFileList={this.state.bgimg ? [{ 'src': this.state.bgimg }] : null} onError={this.onUploadError} /> diff --git a/src/pages/exchangepage/couponTemplate/goodsPage/config/picture.js b/src/pages/exchangepage/couponTemplate/goodsPage/config/picture.js index 0522860d..341132f6 100644 --- a/src/pages/exchangepage/couponTemplate/goodsPage/config/picture.js +++ b/src/pages/exchangepage/couponTemplate/goodsPage/config/picture.js @@ -96,7 +96,6 @@ export default class edittemplate extends React.Component { let oldobj = JSON.parse(sessionStorage.getItem('editorConfig')); let couponList = oldobj.couponList; couponList.product_list.picture = _.cloneDeep(this.state); - console.log(100,couponList); oldobj.couponList = couponList; sessionStorage.setItem('editorConfig', JSON.stringify(oldobj)); } diff --git a/src/pages/exchangepage/edittemplate/goodstemplate.js b/src/pages/exchangepage/edittemplate/goodstemplate.js index 6b204d05..897e01a9 100644 --- a/src/pages/exchangepage/edittemplate/goodstemplate.js +++ b/src/pages/exchangepage/edittemplate/goodstemplate.js @@ -11,7 +11,7 @@ export default class edittemplate extends React.Component { } render() { return ( -
+
{ !this.props.goodsdata.top_image ? : diff --git a/src/pages/exchangepage/edittemplate/goodstemplate.less b/src/pages/exchangepage/edittemplate/goodstemplate.less index 54dcb4c4..b97e241e 100644 --- a/src/pages/exchangepage/edittemplate/goodstemplate.less +++ b/src/pages/exchangepage/edittemplate/goodstemplate.less @@ -178,4 +178,5 @@ //优惠券图片 .picture{ width: 100%; -} \ No newline at end of file +} + diff --git a/src/pages/exchangepage/edittemplate/main.js b/src/pages/exchangepage/edittemplate/main.js index 01ecf1f5..05701350 100644 --- a/src/pages/exchangepage/edittemplate/main.js +++ b/src/pages/exchangepage/edittemplate/main.js @@ -74,6 +74,9 @@ let couponProduct_list = { img:'', jumpType:'0',//0不跳转 1跳转 jumpUrl:'' + }, + backgroundImg:{ + bgImg:'' } } export default class edittemplate extends React.Component { @@ -115,6 +118,13 @@ export default class edittemplate extends React.Component { coupongoodsConfig.picture.img = prop this.setState({ product_list: coupongoodsConfig }) }) + //背景图 + Bus.addListener('bgImg', (prop) => { + let bgImgConfig = this.state.product_list + bgImgConfig.backgroundImg.bgImg = prop + this.setState({ product_list: bgImgConfig }) + }) + setTimeout(() => { let img = document.getElementById('center-img') let center = document.getElementById('center') @@ -728,12 +738,13 @@ export default class edittemplate extends React.Component {

商品列表页:

this.activeChoice(2)} + className={ this.state.activeNavStatus == 2 ? 'activeNav thumbheader' : 'thumbheader' }> -
+