编辑器保存编辑加载动画介入

src/assets/api.js

@@ -802,7 +802,7 @@ export const addTheme= (data) => {
 }
 //编辑落地页模板
 export const putTheme= (id,data) => {
-	return req('put', baseurl + "/plan/plan_theme/"+id,data)
+	return req('put', testzyg + "/plan/plan_theme/"+id,data)
 }
 //我的模板列表查询
 export const getTheme= (data) => {

src/pages/exchangepage/edittemplate/main.js

@@ -4,7 +4,7 @@ import { HashRouter as Router, Route, Link } from "react-router-dom";
 import { Button ,ColorPicker,ImageUpload,Input ,onUpload} from 'zent';
 import  "./main.less"
 import "../../../assets/comm.css"
-import { Notify,Switch ,RadioGroup,RadioButton,Swiper,Dropdown,DropdownPosition,DropdownClickTrigger,Icon,MenuItem,DropdownContent,Menu ,BlockLoading} from 'zent';
+import { Notify,BlockLoading,Switch ,RadioGroup,RadioButton,Swiper,Dropdown,DropdownPosition,DropdownClickTrigger,Icon,MenuItem,DropdownContent,Menu} from 'zent';
 import Ipt from "../../../components/input/main"
 import Form from "../../../components/form/main"
 import FormItem from "../../../components/form-item/main"
@@ -22,6 +22,7 @@ export default class edittemplate extends React.Component{
     super(props)
     this.state={
 		activeshow:true,//控制显示
+		loading_visible:false,
 		detailactiveshow:true,
 		showType:1,//兑换码/白名单/立减金
 		//落地页
@@ -77,48 +78,32 @@ getLandingdata(val){
 	
    componentWillMount(e){
 		sessionStorage.removeItem('editorConfig');
-	let myInfoData = JSON.parse(sessionStorage.getItem("pageInfo"))
+	  let myInfoData = JSON.parse(sessionStorage.getItem("pageInfo"))
-	if(myInfoData)
+		if(myInfoData)
-	{
+		{
-		let writeData = {}
+			let writeData = {}
-		 writeData.title=myInfoData.title;
+			writeData.title=myInfoData.title;
-		 writeData.thumb= myInfoData.thumb;
+			writeData.thumb= myInfoData.thumb;
-		 writeData.page= myInfoData.showType;
+			writeData.page= myInfoData.showType;
-		 writeData.type_id=0;
+			writeData.type_id=0;
-		 writeData.client=1;
+			writeData.client=1;
-		 writeData.describe=myInfoData.describe;
+			writeData.describe=myInfoData.describe;
-		 writeData.top_image=myInfoData.top_image;
+			writeData.top_image=myInfoData.top_image;
-		 writeData.middle_image=myInfoData.middle_image;
+			writeData.middle_image=myInfoData.middle_image;
-		 writeData.bg_color=myInfoData.bg_color;
+			writeData.bg_color=myInfoData.bg_color;
-		 writeData.font_color=myInfoData.font_color;
+			writeData.font_color=myInfoData.font_color;
-		 let product_list=myInfoData.product_list;
+			let product_list=myInfoData.product_list;
-		 let product_detail=myInfoData.product_detail;
+			let product_detail=myInfoData.product_detail;
-		// if(sessionStorage.getItem("isSort") == 1 &&  myInfo.creator == 0)
+			this.setState({model:writeData})
-		// {
+			this.setState({product_list,product_detail})
-		// 	this.setState({isSystemModel:true})
+			let newObj={}
-		// 	model.sort = myInfo.sort;
+			newObj.land=writeData;
-		// }
+			newObj.product_list=product_list;
-		// if(myInfo.href)
+			newObj.product_detail=product_detail;
-		// {
+			sessionStorage.setItem('editorConfig',JSON.stringify(newObj));
-		// 	model.list = parseInt(myInfo.list) 
+		}
-		// 	model.use = myInfo.use
-		// 	model.link = myInfo.link
-		// 	model.edit= myInfo.edit
-		// 	model.href= myInfo.href
-		// 	this.setState({isExchangePage:true})
-			
-		// }
-		this.setState({model:writeData})
-		this.setState({product_list,product_detail})
-		let newObj={}
-		newObj.land=writeData;
-		newObj.product_list=product_list;
-		newObj.product_detail=product_detail;
-		sessionStorage.setItem('editorConfig',JSON.stringify(newObj));
-	}
 	 }
 	 async  onSave(){
-		
 		if(!this.state.model.top_image)
 		{
 			Notify.clear();
@@ -140,10 +125,10 @@ getLandingdata(val){
 			this.setState({activeNavStatus:2});
 			return;
 		}
-		this.setState({activeNavStatus:1});
+
+		this.setState({loading_visible:true,activeNavStatus:1});
 			this.canvasImg.style.display='block';
 			let thumbresult =await this.canvasImgFn();
-
 		let formdata = {
 			"title": this.state.model.title,
 			"thumb": this.state.model.thumb,
@@ -158,26 +143,32 @@ getLandingdata(val){
 			"product_list":this.state.product_list,
 			"product_detail":this.state.product_detail
 		 }
-		 console.log(164,formdata);
+		 let myInfoData = JSON.parse(sessionStorage.getItem("pageInfo"))
-		 addTheme(formdata).then((res)=>{
+		 if(myInfoData){//编辑
-				handelResponse(res,(req,msg)=>{
+		 putTheme(myInfoData.id,formdata).then((res)=>{
-									Notify.success(msg)
+		   		handelResponse(res,(req,msg)=>{
-									setTimeout(() => {
+						 this.setState({loading_visible:false});
-										this.props.history.push('/home/myexchangetemplate');
+				 Notify.success(msg)	
-									}, 2000);
+				 setTimeout(() => {
-				},(err)=>{
+					this.props.history.push('/home/myexchangetemplate');
-							Notify.error(err)
+				}, 2000);
-						})
+		   		},(err)=>{
-	  	});
+				Notify.error(err)
-	  //   if(info.href)
+		       })
-		// {
+		   	});
-		// 	console.log(111111)
+		 }else{//添加
-		// 	formdata.list = this.state.model.list
+			 addTheme(formdata).then((res)=>{
-		// 	formdata.use =  this.state.model.use
+					handelResponse(res,(req,msg)=>{
-		// 	formdata.link = this.state.model.link
+						this.setState({loading_visible:false});
-		// 	formdata.edit= this.state.model.edit
+										Notify.success(msg)
-		// 	formdata.href= this.state.model.href
+										setTimeout(() => {
-			
+											this.props.history.push('/home/myexchangetemplate');
+										}, 2000);
+					},(err)=>{
+								Notify.error(err)
+							})
+				});
+		 }
 
 		// 	putTheme(this.state.model.id,formdata).then((res)=>{
 		//    		handelResponse(res,(req,msg)=>{
@@ -189,7 +180,6 @@ getLandingdata(val){
 		// 		Notify.error(err)
 		//        })
 		//    	});
-			
 		// }
 
 	  //  else{
@@ -691,6 +681,14 @@ getLandingdata(val){
 					</div>
 			   		) :null		
 			   }  
+				 {
+					 this.state.loading_visible?(
+						 <div className="loadingShow">
+							  <div className="modal"></div>
+								<BlockLoading loading icon="circle" iconSize={64} iconText="加载中" />
+						 </div>
+					 ):null
+				 }
 	         </div>
 	       </div>
 	     </div>

src/pages/exchangepage/edittemplate/main.less

@@ -1748,3 +1748,13 @@ div{
 		right: 10px;
 	}
 }
+
+.loadingShow .zent-loading-color-preset--primary[data-zv="9.11.0"] .zent-loading-icon-circle + .zent-loading-icon-text{
+	color:#fff!important;
+}
+.loadingShow .zent-loading--block[data-zv="9.11.0"] {
+	position: fixed;
+	top: 30%;
+	left: 50%;
+	z-index: 99999;
+}