From 823e404707932b6660f3e366d5767383dc70d438 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=A7=9C=E6=A3=9A?= <849005670@qq.com> Date: Thu, 20 Jan 2022 15:45:41 +0800 Subject: [PATCH] =?UTF-8?q?=E6=9B=B4=E6=96=B0=E5=95=86=E5=93=81?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/exchangecode/commodity/goodedit.js | 50 ++++++++-- src/pages/exchangecode/product/add.js | 21 +++- src/pages/plan/product/add.js | 100 ++++++++++--------- 3 files changed, 110 insertions(+), 61 deletions(-) diff --git a/src/pages/exchangecode/commodity/goodedit.js b/src/pages/exchangecode/commodity/goodedit.js index 5b1dcead..dcdbfc2d 100644 --- a/src/pages/exchangecode/commodity/goodedit.js +++ b/src/pages/exchangecode/commodity/goodedit.js @@ -11,8 +11,9 @@ import "./commodity.less" import "./goodedit.less" import Swiper from 'swiper/dist/js/swiper.js' import 'swiper/dist/css/swiper.min.css' +var mySwiper = null; export default class adduserinfo extends React.Component{ - mySwiper = null; + constructor(props){ super(props) this.state={ @@ -43,7 +44,7 @@ export default class adduserinfo extends React.Component{ componentDidMount() { - this.mySwiper = new Swiper('.swiper-container', { + mySwiper = new Swiper('.swiper-container', { slidesPerView: 1, centeredSlides: true, loop : true, @@ -61,7 +62,7 @@ componentDidMount() { this.getProductInfo() } componentWillReceiveProps() { - this.mySwiper.update(); + mySwiper.update(); } //获取直连天下商品映射信息 getProductInfo(){ @@ -107,24 +108,45 @@ componentDidMount() { let defaultPic = [] let arr = [] + let pics = "" + console.log("图",req.describe_url) + if(Array.isArray(req.describe_url)) + { + pics = req.describe_url + } + else{ + + if(req.describe_url!="") + { + pics = req.describe_url.split(',') + } + else{ + pics = [] + } + + } + + + let temp_productpic = this.state.productpic - for(let i = 0;i < req.describe_url.length;i++) + for(let i = 0;i < pics.length;i++) { + let obj = {} - let nameArr = req.describe_url[i].split('/'); + let nameArr = pics[i].split('/'); obj.name = nameArr[5] - obj.src = req.describe_url[i]; + obj.src = pics[i]; defaultPic.push(obj) let obj2={ name:nameArr[5], - url:req.describe_url[i] + url:pics[i] } temp_productpic.push(obj2) } this.setState({temp_productpic}) - + console.log("默认图片",defaultPic) let temp ={ //数据模型不可少 id:req.product_id, @@ -378,7 +400,17 @@ componentDidMount() { let arr =_.map(files,(o)=>{ return o.name }) - console.log("保留的数据",arr) + if(mySwiper !==0) + { + mySwiper.destroy(); + } + mySwiper = new Swiper('.swiper-container', { + observer: true,//修改swiper自己或子元素时，自动初始化swiper + observeParents: true,//修改swiper的父元素时，自动初始化swiper + pagination: '.swiper-pagination', + paginationClickable:true, + autoplay : 3000, + }) if(arr.length > this.state.productpic.length) { diff --git a/src/pages/exchangecode/product/add.js b/src/pages/exchangecode/product/add.js index 4b83a173..6baf1078 100644 --- a/src/pages/exchangecode/product/add.js +++ b/src/pages/exchangecode/product/add.js @@ -11,9 +11,9 @@ import Bus from "../../../assets/eventBus.js" import {getProductInfoSelect,handelResponse,uploadImg} from "../../../assets/api.js" import _ from "lodash"; - +var mySwiper = null; export default class adduserinfo extends React.Component{ - mySwiper = null; + constructor(props){ super(props) this.state={ @@ -42,7 +42,7 @@ export default class adduserinfo extends React.Component{ } componentDidMount() { - this.mySwiper = new Swiper('.swiper-container', { + mySwiper = new Swiper('.swiper-container', { slidesPerView: 1, centeredSlides: true, loop : true, @@ -55,7 +55,7 @@ export default class adduserinfo extends React.Component{ }) } componentWillReceiveProps() { - this.mySwiper.update(); + mySwiper.update(); } componentWillMount(e){ @@ -279,6 +279,19 @@ export default class adduserinfo extends React.Component{ let arr =_.map(files,(o)=>{ return o.name }) + + + if(mySwiper !==0) + { + mySwiper.destroy(); + } + mySwiper = new Swiper('.swiper-container', { + observer: true,//修改swiper自己或子元素时，自动初始化swiper + observeParents: true,//修改swiper的父元素时，自动初始化swiper + pagination: '.swiper-pagination', + paginationClickable:true, + autoplay : 3000, + }) console.log("保留的数据",arr) if(arr.length > this.state.productpic.length) diff --git a/src/pages/plan/product/add.js b/src/pages/plan/product/add.js index 63ae24ed..bce7590d 100644 --- a/src/pages/plan/product/add.js +++ b/src/pages/plan/product/add.js @@ -11,8 +11,8 @@ import _ from "lodash"; import Swiper from 'swiper/dist/js/swiper.js' import 'swiper/dist/css/swiper.min.css' +var mySwiper = 0; export default class adduserinfo extends React.Component{ - mySwiper = null constructor(props){ super(props) this.state={ @@ -42,7 +42,7 @@ export default class adduserinfo extends React.Component{ componentDidMount() { - this.mySwiper = new Swiper('.swiper-container', { + mySwiper = new Swiper('.swiper-container', { slidesPerView: 1, centeredSlides: true, loop : true, @@ -52,11 +52,7 @@ export default class adduserinfo extends React.Component{ observeParents: false, // 修改swiper的父元素时，自动初始化swiper pagination: '.swiper-pagination', paginationClickable:true, - onSlideChangeEnd: function(swiper){ - 　　　this.mySwiper.update(); - 　　　this.mySwiper.startAutoplay(); - 　　 this.mySwiper.reLoop(); - } + }) @@ -126,6 +122,7 @@ export default class adduserinfo extends React.Component{ componentWillReceiveProps() { console.log("更新") + mySwiper.update() // this.mySwiper.stopAutoplay(); // this.mySwiper.update(); @@ -254,7 +251,7 @@ export default class adduserinfo extends React.Component{ console.log("当前商品",cur_product) let picItem = window.goods.find((item)=>{return item.id == cur_product.product_category_id}) - let model2 = {...this.state.model} + let model2 = this.state.model model2.product_id = cur_product.id; model2.product_type=cur_product.type; model2.contract_price=this.state.model.contract_price; @@ -264,21 +261,12 @@ export default class adduserinfo extends React.Component{ model2.product_name=cur_product.title; model2.account_type=cur_product.account_type; model2.show_url=picItem ? picItem.pic : ""; + console.log("商品",this.refs.product_describe) + + model2.describe_url= ""; model2.map_product_name= cur_product.title; model2.detail_url = ""; - // let model2 = { - // product_id:cur_product.id, - // product_type:cur_product.type, - // contract_price:this.state.model.contract_price, - // official_price:cur_product.official_price, - // cost_price:cur_product.cost_price, - // quantity:this.state.model.quantity, - // product_name:this.state.model.product_name, - // account_type:cur_product.account_type, - // show_url:picItem ? picItem.pic : "", - // describe_url:picItem ? picItem.pic : "", - // } this.setState({model:model2}) } @@ -367,9 +355,22 @@ export default class adduserinfo extends React.Component{ onUploadChange3(files,e){ + let arr =_.map(files,(o)=>{ return o.name }) + + if(mySwiper !==0) + { + mySwiper.destroy(); + } + mySwiper = new Swiper('.swiper-container', { + observer: true,//修改swiper自己或子元素时，自动初始化swiper + observeParents: true,//修改swiper的父元素时，自动初始化swiper + pagination: '.swiper-pagination', + paginationClickable:true, + autoplay : 3000, + }) if(arr.length > this.state.productpic.length) { //新增 @@ -381,31 +382,28 @@ export default class adduserinfo extends React.Component{ }) if(index < 0) { - let path = "" - let formdata= new FormData(); - formdata.append("file",files[i].file) - formdata.append("path","common_image") - - uploadImg(formdata).then((res)=>{ - handelResponse(res,(req,msg)=>{ - path = req.path; - let obj={ - name:files[i].name, - url:path - } - let arr = this.state.productpic; - arr.push(obj) - this.setState({arr}) - },(err)=>{ - - }) + let path = "" + let formdata= new FormData(); + formdata.append("file",files[i].file) + formdata.append("path","common_image") + + uploadImg(formdata).then((res)=>{ + handelResponse(res,(req,msg)=>{ + path = req.path; + let obj={ + name:files[i].name, + url:path + } + let arr = this.state.productpic; + arr.push(obj) + this.setState({arr}) + },(err)=>{ + + }) }); } - } - - } if(arr.length < this.state.productpic.length) { @@ -439,13 +437,17 @@ export default class adduserinfo extends React.Component{ } this.setState({productpic:temp_arr}) } + // if(this.mySwiper) + // { + // // this.refs.swiperwrapper + // this.mySwiper.destroy() + + + // } - this.mySwiper.stopAutoplay(); - - this.mySwiper.update(); - this.mySwiper.reLoop(); - this.mySwiper.startAutoplay(); - + + + }; onUploadChange2(files){ @@ -587,6 +589,7 @@ export default class adduserinfo extends React.Component{ + - +