From a497e5418520b4c4ec244b45c7373c72e3cb8f8d Mon Sep 17 00:00:00 2001 From: red-deng-deng <1924913374@qq.com> Date: Fri, 28 Jan 2022 15:25:11 +0800 Subject: [PATCH] =?UTF-8?q?=E6=A8=A1=E6=9D=BF=E7=A9=BA=E5=AD=97=E6=AE=B5?= =?UTF-8?q?=E6=B8=B2=E6=9F=93=E7=B1=BB=E5=9E=8B=E6=97=B6=E5=A4=84=E7=90=86?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/exchangepage/edittemplate/main.js | 14 +- src/pages/exchangepage/mytemplate/main.js | 590 ++++++++++++-------- src/pages/exchangepage/template/main.js | 50 +- 3 files changed, 414 insertions(+), 240 deletions(-) diff --git a/src/pages/exchangepage/edittemplate/main.js b/src/pages/exchangepage/edittemplate/main.js index bd7e7f60..362ae051 100644 --- a/src/pages/exchangepage/edittemplate/main.js +++ b/src/pages/exchangepage/edittemplate/main.js @@ -115,9 +115,22 @@ getLandingdata(val){ template=typePage; } let exchangeList=newEditor.exchange; + if(!exchangeList){ + exchangeList={}; + exchangeList.land=model; + exchangeList.product_list=product_list; + exchangeList.product_detail=product_detail; + } + exchangeList['land'].title=newEditor.title; exchangeList['land'].sort=newEditor.sort; let whiteList=newEditor.access_conf; + if(!whiteList){ + whiteList={} + whiteList.land=model; + whiteList.product_list=product_list; + whiteList.product_detail=product_detail; + } whiteList['land'].title=newEditor.title; whiteList['land'].sort=newEditor.sort; newEditor.exchangeList=exchangeList; @@ -579,7 +592,6 @@ getLandingdata(val){ case 812:style={width:'375px',height:'812px',transform: 'scale(0.75)'};fontSize=10000/(375*0.75);break; case 500:style={width:'375px',height:'500px',transform: 'scale(0.75)'};fontSize=10000/(375*0.75);break; } - console.log('fontSize',fontSize); this.setState({setStyle:style,activeHeight:height,fontSize}); } componentWillUnmount(){ diff --git a/src/pages/exchangepage/mytemplate/main.js b/src/pages/exchangepage/mytemplate/main.js index 5418df2a..ad897822 100644 --- a/src/pages/exchangepage/mytemplate/main.js +++ b/src/pages/exchangepage/mytemplate/main.js @@ -1,8 +1,20 @@ import ReactDOM from 'react-dom'; -import React, { Component } from 'react'; -import { Link } from "react-router-dom"; -import { Button,Tag,Sweetalert,CombinedDateRangePicker,Notify,Switch,Pop} from 'zent'; -import "./main.less" +import React, { + Component +} from 'react'; +import { + Link +} from "react-router-dom"; +import { + Button, + Tag, + Sweetalert, + CombinedDateRangePicker, + Notify, + Switch, + Pop +} from 'zent'; +import "./main.less" import _ from "lodash"; import "../../../assets/comm.css" import Ipt from "../../../components/input/main" @@ -10,19 +22,22 @@ import Grid from "../../../components/gird/main.js" import TabPage from "../../../components/tabPage/main.js" import Filterbar from "../../../components/filterbar/main.js" import menu from "../../../assets/enum.js" -import {handelResponse,getTheme,delTheme} from "../../../assets/api.js" -const Column = [ - { +import { + handelResponse, + getTheme, + delTheme +} from "../../../assets/api.js" +const Column = [{ title: '缩略图', name: 'thumb', - prop:'thumb', + prop: 'thumb', type: "slot", - width:'10%', + width: '10%', }, { title: '标题', - prop:'title', + prop: 'title', name: 'title', - width:'auto', + width: 'auto', type: "normal", }, { @@ -30,259 +45,374 @@ const Column = [ prop: 'client', name: 'client', type: "slot", - width:'auto', - + width: 'auto', + }, { title: '更新时间', prop: 'update_time', name: 'update_time', type: "normal", - width:'auto', - + width: 'auto', + }, { title: '创建人', prop: 'user_name', name: 'user_name', type: "normal", - width:'auto', - + width: 'auto', + }, { title: '操作', prop: 'edit', name: 'edit', type: "slot", - width:'auto', + width: 'auto', }, ]; -export default class acclist extends React.Component{ - constructor(props){ - super(props) - this.state={ - distdata:[], - total:0, - combinedValue:[], - page:1, - limit:10, - tabList:[{title:"我的模板列表"}], - DateTime:'',//数据更新时间 - key_word:'', - tableHeight:600, - dataCount:0, +export default class acclist extends React.Component { + constructor(props) { + super(props) + this.state = { + distdata: [], + total: 0, + combinedValue: [], + page: 1, + limit: 10, + tabList: [{ + title: "我的模板列表" + }], + DateTime: '', //数据更新时间 + key_word: '', + tableHeight: 600, + dataCount: 0, + } } - } - componentDidUpdate(prevProps,prevState){ - // 参数分别为改变之前的数据状态对象 - if(prevState.key_word!=this.state.key_word &&!this.state.key_word){ - - this.sureFn(); - } - } + componentDidUpdate(prevProps, prevState) { + // 参数分别为改变之前的数据状态对象 + if (prevState.key_word != this.state.key_word && !this.state.key_word) { + this.sureFn(); + } + + } //敲回车查询 - sureFn(){ - - this.setState({page:1}); - this.setState({limit:10}) - - let data = { - page:1, - limit:10, - title:this.state.key_word - } + sureFn() { + + this.setState({ + page: 1 + }); + this.setState({ + limit: 10 + }) + + let data = { + page: 1, + limit: 10, + title: this.state.key_word + } this.getTableList(data); } - editFn(e,row){ - - if(row.creator == 0 ) - { - Notify.clear(); - Notify.error("系统模板不可编辑"); - return - } - - sessionStorage.setItem("pageInfo", JSON.stringify(row)) - - sessionStorage.setItem("mouldType", 1) - - sessionStorage.setItem("pageChange", 1) - // let link = window.location.href.replace(window.location.hash, "#/edittemplate"); - // window.open(link, "_blank") - window.location.href="/#/edittemplate"; - } - getTableList(data){ - getTheme(data).then(res=>{ - handelResponse(res,(req,msg)=>{ - - this.setState({dataCount:req.total}) - this.setState({distdata:req.data}) - - },(err)=>{ - - }) - }).catch(err=>{ - }); - } + editFn(e, row) { -componentWillMount(){ - let selt=this; - this.setState({tableHeight:window.innerHeight-390}); - let data={ - page:this.state.page, - limit:this.state.limit - } - if(this.state.combinedValue&&this.state.combinedValue[0]){ - data.begin_time=this.state.combinedValue[0]; - data.end_time=this.state.combinedValue[1]; - } - this.getTableList(data); -} + if (row.creator == 0) { + Notify.clear(); + Notify.error("系统模板不可编辑"); + return + } - //limit - countChange(e){ - this.setState({page:1,limit:e}); - let data = { - page:e, - limit:this.state.limit + sessionStorage.setItem("pageInfo", JSON.stringify(row)) + + sessionStorage.setItem("mouldType", 1) + + sessionStorage.setItem("pageChange", 1) + // let link = window.location.href.replace(window.location.hash, "#/edittemplate"); + // window.open(link, "_blank") + window.location.href = "/#/edittemplate"; + } + getTableList(data) { + getTheme(data).then(res => { + handelResponse(res, (req, msg) => { + + this.setState({ + dataCount: req.total + }) + this.setState({ + distdata: req.data + }) + + }, (err) => { + + }) + }).catch(err => {}); } - this.getTableList(data); - } + componentWillMount() { + let selt = this; + this.setState({ + tableHeight: window.innerHeight - 390 + }); + let data = { + page: this.state.page, + limit: this.state.limit + } + if (this.state.combinedValue && this.state.combinedValue[0]) { + data.begin_time = this.state.combinedValue[0]; + data.end_time = this.state.combinedValue[1]; + } + this.getTableList(data); + } -pageChange(e){ - this.setState({page:e}) - let data = { - page:e, - limit:this.state.limit - } - if(this.state.key_word){ - data.title=this.state.key_word; - } - this.getTableList(data); -} + //limit + countChange(e) { + this.setState({ + page: 1, + limit: e + }); + let data = { + page: e, + limit: this.state.limit + } -newTemplate(e){ - sessionStorage.setItem("pageInfo",null) - let link = window.location.href.replace(window.location.hash, "#/home/mytempMould"); - window.open(link, "_blank") -} + this.getTableList(data); + } + + pageChange(e) { + this.setState({ + page: e + }) + let data = { + page: e, + limit: this.state.limit + } + if (this.state.key_word) { + data.title = this.state.key_word; + } + this.getTableList(data); + } + + newTemplate(e) { + sessionStorage.setItem("pageInfo", null) + let link = window.location.href.replace(window.location.hash, "#/home/mytempMould"); + window.open(link, "_blank") + } -delFn(e,row){ - if(row.creator == 0 ) - { - Notify.error("系统模板不可删除"); - return - } - - - - let self=this; - Sweetalert.confirm({ - type:'warning', - closeBtn:true, - title:'确认操作', - content:

是否删除[{row.title}]？

, - onConfirm:()=>{ - delTheme(row.id).then(res=>{ - handelResponse(res,(response,msg)=>{ - Notify.clear(); - Notify.success(msg); - let data = { - page:this.state.page, - limit:this.state.limit, - title:this.state.key_word - } - - self.getTableList(data); - },(err)=>{ - - }) - }).catch(err=>{ - }); - }, - onCancel: this.onCancel, - className:'questModal', - parentComponent: this - }); -} - render(){ + delFn(e, row) { + if (row.creator == 0) { + Notify.error("系统模板不可删除"); + return + } - const { current, pageSize } = this.state; - return( -
- -

- < - Button type = "primary" - icon = "plus" - onClick={(e)=>{ this.newTemplate(e) }} - - > 新增模板 < /Button> - {/* */} - {this.setState({key_word:''})}} wordSearch={this.sureFn.bind(this)} onChange={(e)=>this.setState({key_word:e})} value={this.state.key_word} icon="search" placeholder={"请输入关键字进行匹配查询"} countShow={false} height={'36px'} width={'260px'} alignment={'left'}/> -

-
- { - this.pageChange(e) - }} - countChange={ - (e)=>{ - this.countChange(e) - } - } - checkChange ={(selection)=>{ - - }} - ComponentHandler={(com,rowData)=>{ - - if(com=='thumb'){ - return }> - - - + + + let self = this; + Sweetalert.confirm({ + type: 'warning', + closeBtn: true, + title: '确认操作', + content: < p > 是否删除 < b > [{ + row.title + }] < /b>？

, + onConfirm: () => { + delTheme(row.id).then(res => { + handelResponse(res, (response, msg) => { + Notify.clear(); + Notify.success(msg); + let data = { + page: this.state.page, + limit: this.state.limit, + title: this.state.key_word + } + + self.getTableList(data); + }, (err) => { + + }) + }).catch(err => {}); + }, + onCancel: this.onCancel, + className: 'questModal', + parentComponent: this + }); + } + render() { + + const { + current, + pageSize + } = this.state; + return ( < + div id = "exchangecodelist" > + < + TabPage tabs = { + this.state.tabList + } > + < + p className = "codetable dflexj" > + < + Button type = "primary" + icon = "plus" + onClick = { + (e) => { + this.newTemplate(e) } - if (com == "client") { - return < font className = "icon" - style = { - { - background: menu.pageTypeStatusBg(parseInt(rowData.page)) - } - } > < /font>{menu.pageTypeStatus(parseInt(rowData.page))} ; - } - - if (com == "edit") { - return - < - a - className = "grid-link" onClick={(e)=>{ - this.editFn(e,rowData) - }} > 编辑 < /a> < - a onClick={(e)=>{this.delFn(e,rowData)}} - className = "grid-link" > 删除 < /a> - - < - /span> - } - }} - /> -
- -
- ) - } -} \ No newline at end of file + } + + > + 新增模板 < /Button> { + /* */ } < + Ipt onClearItem = { + (e) => { + this.setState({ + key_word: '' + }) + } + } + wordSearch = { + this.sureFn.bind(this) + } + onChange = { + (e) => this.setState({ + key_word: e + }) + } + value = { + this.state.key_word + } + icon = "search" + placeholder = { + "请输入关键字进行匹配查询" + } + countShow = { + false + } + height = { + '36px' + } + width = { + '260px' + } + alignment = { + 'left' + } + /> < + /p> < + div className = "code-table" > + < + Grid spliteColor = { + '#fff' + } + tableData = { + this.state.distdata + } + Column = { + Column + } + maxheight = { + this.state.tableHeight + } + countbarVisible = { + false + } + isSwitch = { + false + } + page = { + this.state.page + } + dataCount = { + this.state.dataCount + } + isMultiple = { + false + } + pageChange = { + (e) => { + this.pageChange(e) + } + } + countChange = { + (e) => { + this.countChange(e) + } + } + checkChange = { + (selection) => { + + } + } + ComponentHandler = { + (com, rowData) => { + + if (com == 'thumb') { + return }> < + img src = { + rowData.thumb + } + alt = "" + style = { + { + width: '30px', + height: '30px' + } + } + /> < + /Pop> + + } + if (com == "client") { + return < font className = "icon" + style = { + { + background: menu.pageTypeStatusBg(parseInt(rowData.page)) + } + } > < /font>{menu.pageTypeStatus(parseInt(rowData.page))} ; + } + + if (com == "edit") { + return + < + a + className = "grid-link" + onClick = { + (e) => { + this.editFn(e, rowData) + } + } > 编辑 < /a> < + a onClick = { + (e) => { + this.delFn(e, rowData) + } + } + className = "grid-link" > 删除 < /a> + + < + /span> + } + } + } + /> < + /div> < + /TabPage> < + /div> + ) + } + } \ No newline at end of file diff --git a/src/pages/exchangepage/template/main.js b/src/pages/exchangepage/template/main.js index a30cfb3f..40879735 100644 --- a/src/pages/exchangepage/template/main.js +++ b/src/pages/exchangepage/template/main.js @@ -9,9 +9,31 @@ import "../../../assets/comm.css" import PreviewItem from "./preview.js" import {handelResponse,getThemeType,getSystemTemplate,getTheme,copyThemecustom} from "../../../assets/api.js" -window.addEventListener('scroll',function(){ - console.log('滚动'); -}); + +let model={ + title:"落地页标题", + top_image: "", + middle_image: "", + describe: {type:"",content :"",bg_image:''}, + bg_color:"#EEEEEE", + sort:1, + type_id:{ key:2,text:'通用'}, + font_color:"#000000", + thumb:'' +} + //商品列表 + let product_list={ + top_image: "", + list:"2", + font_color:"#ffffff", + button_color: "#FACD6A", + describe: {type : "", content : "",bg_image:''}, + } + let product_detail={ + font_color:"#ffffff", + button_color: "#FACD6A", + describe:{type: "", content: "",bg_image:''}, + } export default class mytemplate extends React.Component{ constructor(props){ super(props) @@ -225,14 +247,24 @@ export default class mytemplate extends React.Component{ onPreview(row){ let rowdata={}; + rowdata.model=model; + rowdata.product_list=product_list; + rowdata.product_detail=product_detail; let exchangedata={} + exchangedata.model=model; + exchangedata.product_list=product_list; + exchangedata.product_detail=product_detail; this.setState({moudleData:row,showPage:1,pageStep:1,activeHeight:667, setStyle:{width:'375px',height:'667px',transform: 'scale(0.75)'}}); - rowdata.model=row.access_conf.land; - rowdata.product_list=row.access_conf.product_list; - rowdata.product_detail=row.access_conf.product_detail; - exchangedata.model=row.exchange.land; - exchangedata.product_list=row.exchange.product_list; - exchangedata.product_detail=row.exchange.product_detail; + if(row.access_conf){ + rowdata.model=row.access_conf.land; + rowdata.product_list=row.access_conf.product_list; + rowdata.product_detail=row.access_conf.product_detail; + } + if(row.exchange){ + exchangedata.model=row.exchange.land; + exchangedata.product_list=row.exchange.product_list; + exchangedata.product_detail=row.exchange.product_detail; + } this.setState({preview_url:row.href}) this.setState({preview_visible:true,showType:row.page}) this.setState({previewwhite:rowdata})