diff --git a/src/pages/exchangecode/edit/edit.js b/src/pages/exchangecode/edit/edit.js index 97ac742e..0cb65dcd 100644 --- a/src/pages/exchangecode/edit/edit.js +++ b/src/pages/exchangecode/edit/edit.js @@ -573,6 +573,7 @@ export default class exchangedit extends React.Component { this.setState({ codeInfo: model2 }) } + //渲染范围列表数据以及数据转换 async productSubmit() { let visible = '' if (this.state.addIsType === 'addProduct') { @@ -615,7 +616,7 @@ export default class exchangedit extends React.Component { data = JSON.parse(sessionStorage.getItem('knockGoldData')) temp = _.map(data, (item) => { let index = this.state.tempdata.findIndex((o) => { - return o.product_id === item.id + return o.product_id === item.uuid }) if (index > -1) { @@ -625,7 +626,7 @@ export default class exchangedit extends React.Component { /* 转换商品结构 */ // temp return { - product_id: item.id, + product_id: item.uuid, product_name: item.batch_goods_name, //名字 cost_price: '', contract_price: item.contract_price, //单价 @@ -689,6 +690,7 @@ export default class exchangedit extends React.Component { } } + /* 修改商品名称 */ onNameChange(e, row) { let rowIndex = this.state.tempdata.findIndex((o) => { return o.product_id == row.product_id @@ -696,6 +698,8 @@ export default class exchangedit extends React.Component { this.state.tempdata[rowIndex].product_name = e.target.value this.setState({ tempdata: this.state.tempdata }) } + + /* 修改库存总数 */ onQuantityChange(e, row) { this.setState({ tempdata: this.state.tempdata }) let value = e.target.value @@ -713,6 +717,8 @@ export default class exchangedit extends React.Component { value - this.state.tempdata[rowIndex].usage this.setState({ tempdata: this.state.tempdata }) } + + /* 修改合同价 */ onPriceChange(e, row) { let str = e.target.value let value = str @@ -851,6 +857,7 @@ export default class exchangedit extends React.Component { }) } + /* 商品范围列表编辑 */ productEditShow(rowData) { console.log('direct_reseller_id ==>', this.state.direct_reseller_id) console.log('rowData 12==>', rowData) @@ -865,7 +872,7 @@ export default class exchangedit extends React.Component { if (rowData.type === 'knockGold') { const temp = JSON.parse(sessionStorage.getItem('knockGoldData')) const editData = temp.filter( - (item) => item.id === rowData.product_id + (item) => item.uuid === rowData.product_id ) this.setState({ diff --git a/src/pages/order/list/list.js b/src/pages/order/list/list.js index 4a6ca691..8497ba69 100644 --- a/src/pages/order/list/list.js +++ b/src/pages/order/list/list.js @@ -1,609 +1,734 @@ -import ReactDOM from 'react-dom'; -import React, { Component } from 'react'; -import { Link } from "react-router-dom"; -import { Button,Notify,Select,Alert,CombinedDateRangePicker,Sweetalert,Icon} from 'zent'; -import "./list.less" -import "../../../assets/comm.css" -import Ipt from "../../../components/input/main" -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 { nowMonth, nowDay } from "../../../assets/comm.js"; -import {getOrderList,getOrderExport,handelResponse,putOrderSuccess,putOrderCancel} from "../../../assets/api.js" -var moment = require("moment"); -let day = moment(nowDay()).format("YYYY-MM-DD"); -let tomonth = moment(nowMonth()).format("YYYY-MM-DD"); +import ReactDOM from 'react-dom' +import React, { Component } from 'react' +import { Link } from 'react-router-dom' +import { + Button, + Notify, + Select, + Alert, + CombinedDateRangePicker, + Sweetalert, + Icon +} from 'zent' +import './list.less' +import '../../../assets/comm.css' +import Ipt from '../../../components/input/main' +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 { nowMonth, nowDay } from '../../../assets/comm.js' +import { + getOrderList, + getOrderExport, + handelResponse, + putOrderSuccess, + putOrderCancel +} from '../../../assets/api.js' +var moment = require('moment') +let day = moment(nowDay()).format('YYYY-MM-DD') +let tomonth = moment(nowMonth()).format('YYYY-MM-DD') const options = [ { key: '1', - text: '查询key', + text: '查询key' }, { key: '2', - text: '通用查询', + text: '通用查询' } -]; +] const Column = [ { title: '订单号', name: 'order_number', - prop:'order_number', - type: "normal", - width:'100px' - }, { + prop: 'order_number', + type: 'normal', + width: '100px' + }, + { title: '兑换码-批次ID', name: 'code_batch_id', - prop:'code_batch_id', - type: "normal", - width:'100px' + prop: 'code_batch_id', + type: 'normal', + width: '100px' }, { title: '商品名称', - prop:'product_name', + prop: 'product_name', name: 'product_name', - width:'120px', - type: "normal", - }, { + width: '120px', + type: 'normal' + }, + { title: '官方价格', name: 'official_price', - prop:'official_price', - type: "normal", - width:'auto' + prop: 'official_price', + type: 'normal', + width: 'auto' }, { title: '合同价(成本价)', name: 'cost', - type: "slot", - prop:'cost', - width:'auto' + type: 'slot', + prop: 'cost', + width: 'auto' }, { title: '分销商', name: 'reseller_name', - type: "normal", - prop:'reseller_name', - width:'auto', - },{ + type: 'normal', + prop: 'reseller_name', + width: 'auto' + }, + { title: '归属营销计划', name: 'plan_title', - prop:'plan_title', - width:'auto', - type: "normal", - }, + prop: 'plan_title', + width: 'auto', + type: 'normal' + }, { title: '购买数量', name: 'num', - type: "normal", - prop:'num', - width:'auto', + type: 'normal', + prop: 'num', + width: 'auto' }, - { + { title: '状态', name: 'statusDom', - prop:'statusDom', - type: "slot", - width:'auto', + prop: 'statusDom', + type: 'slot', + width: 'auto' }, { title: '操作', prop: 'opearo', name: 'opearo', - type: "slot", - width:'140px', + type: 'slot', + width: '140px' }, { title: '创建时间', name: 'create_time', - prop:'create_time', - width:'120px', - type: "normal", - }, { + prop: 'create_time', + width: '120px', + type: 'normal' + }, + { title: '账号', name: 'account', - type: "normal", - prop:'account', - width:'auto', + type: 'normal', + prop: 'account', + width: 'auto' }, { title: '订单类型', name: 'type_text', - prop:'type_text', - width:'auto', - type: "normal", + prop: 'type_text', + width: 'auto', + type: 'normal' }, { title: '折扣', name: 'discount', - type: "normal", - prop:'discount', - width:'auto', + type: 'normal', + prop: 'discount', + width: 'auto' }, { title: '结算', name: 'total', - prop:'total', - width:'auto', - type: "normal", + prop: 'total', + width: 'auto', + type: 'normal' }, { title: 'key', name: 'key', - prop:'key', - width:'auto', - type: "normal", + prop: 'key', + width: 'auto', + type: 'normal' } -]; +] -export default class orderlist extends React.Component{ - constructor(props){ +export default class orderlist extends React.Component { + constructor(props) { super(props) - this.state={ - tabList:[{title:"订单列表"}], - orderList:[], - filterList:[{id:0,label:"订单状态",prop:"status",menuList:[{id:999,name:"全部"},{id:1,name:"充值中"},{id:2,name:"已完成"},{id:3,name:"充值失败"},{id:4,name:"已取消"}]}], - selectiondata:[], - menuList:[{id:0,name:"订单状态",check:false}] - ,allcheck:false, - itemcheck:false, - combinedValue:[], - tableHeight:500, - status:null, - page:1, - limit:10, - key_word:'', - officialprice:0,contractprice:0,costprice:0,totalprice:0 - } - this.onChangeCombinedDate=this.onChangeCombinedDate.bind(this); + this.state = { + tabList: [{ title: '订单列表' }], + orderList: [], + filterList: [ + { + id: 0, + label: '订单状态', + prop: 'status', + menuList: [ + { id: 999, name: '全部' }, + { id: 1, name: '充值中' }, + { id: 2, name: '已完成' }, + { id: 3, name: '充值失败' }, + { id: 4, name: '已取消' } + ] + } + ], + selectiondata: [], + menuList: [{ id: 0, name: '订单状态', check: false }], + allcheck: false, + itemcheck: false, + combinedValue: [], + tableHeight: 500, + status: null, + page: 1, + limit: 10, + key_word: '', + officialprice: 0, + contractprice: 0, + costprice: 0, + totalprice: 0 + } + this.onChangeCombinedDate = this.onChangeCombinedDate.bind(this) } //选中表格的选框 - selection(selection){ - this.setState({selectiondata:selection}); - let officialprice=0; - let contractprice=0; - let costprice=0; - let totalprice=0; - selection.forEach(item=>{ - officialprice+=Number(item.official_price); - contractprice+=Number(item.contract_price); - costprice+=Number(item.cost_price); - totalprice+=Number(item.total); - }); - this.setState({officialprice,contractprice,costprice,totalprice}); - } - //新建订单 - clickFn(){ - this.props.history.push('/order-add'); - sessionStorage.setItem('pathname2','/order-add') - let activerou=[{items:[ + selection(selection) { + this.setState({ selectiondata: selection }) + let officialprice = 0 + let contractprice = 0 + let costprice = 0 + let totalprice = 0 + selection.forEach((item) => { + officialprice += Number(item.official_price) + contractprice += Number(item.contract_price) + costprice += Number(item.cost_price) + totalprice += Number(item.total) + }) + this.setState({ officialprice, contractprice, costprice, totalprice }) + } + //新建订单 + clickFn() { + this.props.history.push('/order-add') + sessionStorage.setItem('pathname2', '/order-add') + let activerou = [ { - "path": "/home/order-list", - "name": "订单管理" - }, - { - "path": "/home/order-add", - "name": "新建订单" + items: [ + { + path: '/home/order-list', + name: '订单管理' + }, + { + path: '/home/order-add', + name: '新建订单' + } + ] } - ]}] - sessionStorage.setItem('breaknav',JSON.stringify(activerou)); + ] + sessionStorage.setItem('breaknav', JSON.stringify(activerou)) } //批量作废 - batchdelFn(){ - if(this.state.selectiondata.length<1){ - Notify.clear(); - Notify.warn('请先勾选需作废的选项'); - }else{ + batchdelFn() { + if (this.state.selectiondata.length < 1) { + Notify.clear() + Notify.warn('请先勾选需作废的选项') + } else { Sweetalert.confirm({ - type:'warning', - closeBtn:true, - title:'确认操作', + type: 'warning', + closeBtn: true, + title: '确认操作', content:

是否作废选中【充值中】的订单?

, - onConfirm(){ - alert('开始调用作废接口'); + onConfirm() { + alert('开始调用作废接口') }, - onCancel(){ - - }, - className:'questModal', + onCancel() {}, + className: 'questModal', parentComponent: this - }); + }) } } - + //导出订单 - exportFn(){ - let _self=this; - let {key_word,key,status,option}=_self.state; - let data={} - if(this.state.combinedValue&&this.state.combinedValue[0]){ - data.begin_time=this.state.combinedValue[0]; - data.end_time=this.state.combinedValue[1]; - } - - if(status||status===0){ - data.status=status; - } - - if(option&&option.key==1){ - if(key_word){ - data.key=key_word; + exportFn() { + let _self = this + let { key_word, key, status, option } = _self.state + let data = {} + if (this.state.combinedValue && this.state.combinedValue[0]) { + data.begin_time = this.state.combinedValue[0] + data.end_time = this.state.combinedValue[1] } - } - if(option&&option.key==2){ - if(key_word){ - data.key_word=key_word; + if (status || status === 0) { + data.status = status } - } - if(this.state.selectiondata&&this.state.selectiondata.length>0){ - let orders=this.state.selectiondata; - let orderNum=orders.map(item=>item.order_number); - data.order_numbers=orderNum.join(','); - } + if (option && option.key == 1) { + if (key_word) { + data.key = key_word + } + } + + if (option && option.key == 2) { + if (key_word) { + data.key_word = key_word + } + } + if (this.state.selectiondata && this.state.selectiondata.length > 0) { + let orders = this.state.selectiondata + let orderNum = orders.map((item) => item.order_number) + data.order_numbers = orderNum.join(',') + } Sweetalert.confirm({ - type:'warning', - closeBtn:true, - title:'确认操作', + type: 'warning', + closeBtn: true, + title: '确认操作', content:

是否导出订单?

, - onConfirm(){ - getOrderExport(data).then(res=>{ - if(res.type=='application/json'){ - const reader = new FileReader(); //创建一个FileReader实例 - reader.readAsText(res, 'utf-8'); //读取文件,结果用字符串形式表示 - reader.onload=function(){ - const obj = JSON.parse(reader.result); - Notify.clear() - Notify.error(obj.message) - } - }else{ - let bl = new Blob([res]); - let fileName = '订单管理'+_self.getnow()+ ".xlsx"; //设置文件名 - var link = document.createElement('a');//创建标签 - link.href = window.URL.createObjectURL(bl); - link.download = fileName;//下载的文件名 - link.click(); - window.URL.revokeObjectURL(link.href);//清除URL - } - }).catch(err=>{ - }); + onConfirm() { + getOrderExport(data) + .then((res) => { + if (res.type == 'application/json') { + const reader = new FileReader() //创建一个FileReader实例 + reader.readAsText(res, 'utf-8') //读取文件,结果用字符串形式表示 + reader.onload = function () { + const obj = JSON.parse(reader.result) + Notify.clear() + Notify.error(obj.message) + } + } else { + let bl = new Blob([res]) + let fileName = '订单管理' + _self.getnow() + '.xlsx' //设置文件名 + var link = document.createElement('a') //创建标签 + link.href = window.URL.createObjectURL(bl) + link.download = fileName //下载的文件名 + link.click() + window.URL.revokeObjectURL(link.href) //清除URL + } + }) + .catch((err) => {}) }, - - onCancel(){ - - }, - className:'questModal', + + onCancel() {}, + className: 'questModal', parentComponent: this - }); + }) } - //获取当前时间 - getnow() { - var now = new Date(); - var year = now.getFullYear(); - var month = - now.getMonth() + 1 <= 9 - ? "0" + (now.getMonth() + 1) - : now.getMonth() + 1; - var day = now.getDate() <= 9 ? "0" + now.getDate() : now.getDate(); - var tt = now.getHours() <= 9 ? "0" + now.getHours() : now.getHours(); - var mm = - now.getMinutes() <= 9 ? "0" + now.getMinutes() : now.getMinutes(); - var ss = - now.getSeconds() <= 9 ? "0" + now.getSeconds() : now.getSeconds(); - let datelist = [year, month, day, tt, mm, ss]; - return datelist.join(""); - } - componentWillMount(){ - this.setState({tableHeight:window.innerHeight-430}); + //获取当前时间 + getnow() { + var now = new Date() + var year = now.getFullYear() + var month = + now.getMonth() + 1 <= 9 ? '0' + (now.getMonth() + 1) : now.getMonth() + 1 + var day = now.getDate() <= 9 ? '0' + now.getDate() : now.getDate() + var tt = now.getHours() <= 9 ? '0' + now.getHours() : now.getHours() + var mm = now.getMinutes() <= 9 ? '0' + now.getMinutes() : now.getMinutes() + var ss = now.getSeconds() <= 9 ? '0' + now.getSeconds() : now.getSeconds() + let datelist = [year, month, day, tt, mm, ss] + return datelist.join('') + } + componentWillMount() { + this.setState({ tableHeight: window.innerHeight - 430 }) } //作废 - deleteFn(e,row){ - let self=this; - Sweetalert.confirm({ - type:'warning', - closeBtn:true, - title:'确认操作', - content:

是否作废[{row.order_number}]

, - onConfirm(){ - putOrderCancel(row.order_number).then(res=>{ - handelResponse(res,(response,msg)=>{ - Notify.clear(); - Notify.success(msg); - self.getOrderFn(); - },(err)=>{ - Notify.error(err) - }) - }).catch(err=>{ - }); - }, - onCancel(){ - - }, - className:'questModal', - parentComponent: this - }); + deleteFn(e, row) { + let self = this + Sweetalert.confirm({ + type: 'warning', + closeBtn: true, + title: '确认操作', + content: ( +

+ 是否作废[{row.order_number}]? +

+ ), + onConfirm() { + putOrderCancel(row.order_number) + .then((res) => { + handelResponse( + res, + (response, msg) => { + Notify.clear() + Notify.success(msg) + self.getOrderFn() + }, + (err) => { + Notify.error(err) + } + ) + }) + .catch((err) => {}) + }, + onCancel() {}, + className: 'questModal', + parentComponent: this + }) } //改为成功 - changeSuccessFn(e,row){ - let self=this; - Sweetalert.confirm({ - type:'warning', - closeBtn:true, - title:'确认操作', - content:

是否将[{row.order_number}]订单改为成功状态?

, - onConfirm(){ - putOrderSuccess(row.order_number).then(res=>{ - handelResponse(res,(response,msg)=>{ - Notify.clear(); - Notify.success(msg); - self.getOrderFn(); - },(err)=>{ - Notify.error(err) - }) - }).catch(err=>{ - }); - }, - onCancel(){ - - }, - className:'questModal', - parentComponent: this - }); - } - //详情 - moreFn(e,row){ - this.props.history.push('/home/order-addetails?oid='+row.order_number); - sessionStorage.setItem('pathname2','/home/order-addetails') - let activerou=[{items:[ - { - "path": "/home/order-list", - "name": "订单管理" + changeSuccessFn(e, row) { + let self = this + Sweetalert.confirm({ + type: 'warning', + closeBtn: true, + title: '确认操作', + content: ( +

+ 是否将[{row.order_number}]订单改为成功状态? +

+ ), + onConfirm() { + putOrderSuccess(row.order_number) + .then((res) => { + handelResponse( + res, + (response, msg) => { + Notify.clear() + Notify.success(msg) + self.getOrderFn() + }, + (err) => { + Notify.error(err) + } + ) + }) + .catch((err) => {}) }, - { - "path": "/home/order-addetails", - "name": "订单详情" - } - ]}] - sessionStorage.setItem('breaknav',JSON.stringify(activerou)); + onCancel() {}, + className: 'questModal', + parentComponent: this + }) + } + //详情 + moreFn(e, row) { + this.props.history.push('/home/order-addetails?oid=' + row.order_number) + sessionStorage.setItem('pathname2', '/home/order-addetails') + let activerou = [ + { + items: [ + { + path: '/home/order-list', + name: '订单管理' + }, + { + path: '/home/order-addetails', + name: '订单详情' + } + ] + } + ] + sessionStorage.setItem('breaknav', JSON.stringify(activerou)) + } + //再次充值 + againinvestFn(e, row) {} + //清空 + clearFn() { + this.setState({ selectiondata: [] }) + this.setState({ allcheck: false }) + this.setState({ itemcheck: false }) } - //再次充值 - againinvestFn(e,row){ - } - //清空 - clearFn(){ - this.setState({'selectiondata':[]}) - this.setState({allcheck:false}) - this.setState({itemcheck:false}) - } - - //选择时间 - onChangeCombinedDate(e){ - this.setState({combinedValue:e}); - this.getOrderFn(e); + //选择时间 + onChangeCombinedDate(e) { + this.setState({ combinedValue: e }) + this.getOrderFn(e) } //page - pageChange(e){ - this.setState({page:e}); - this.setState({'selectiondata':[]}) + pageChange(e) { + this.setState({ page: e }) + this.setState({ selectiondata: [] }) setTimeout(() => { - this.getOrderFn(); - }, 0); - + this.getOrderFn() + }, 0) } //limit - countChange(e){ - this.setState({page:1,limit:e}); - this.setState({'selectiondata':[]}) + countChange(e) { + this.setState({ page: 1, limit: e }) + this.setState({ selectiondata: [] }) setTimeout(() => { - this.getOrderFn(); - }, 0); + this.getOrderFn() + }, 0) } - //敲回车查询 - sureFn(){ - this.setState({page:1}); - setTimeout(()=>{ - this.getOrderFn(); - },300); - + //敲回车查询 + sureFn() { + this.setState({ page: 1 }) + setTimeout(() => { + this.getOrderFn() + }, 300) + } + + onFilterClose(prop) { + let data = {} + data[prop] = null + this.setState(data) + } + + //获取订单列表 + getOrderFn(time = {}) { + let _self = this + let { page, limit, option, key_word, status } = _self.state + let data = { page, limit } + if (this.state.combinedValue && this.state.combinedValue[0]) { + data.begin_time = this.state.combinedValue[0] + data.end_time = this.state.combinedValue[1] + } + if (status || status === 0) { + data.status = status + } + if (time && time[0]) { + data.begin_time = time[0] + data.end_time = time[1] + } + if (time && time[0] == null && time.length > 1) { + delete data.begin_time + delete data.end_time + } + if (option && option.key == 1) { + if (key_word) { + data.key = key_word + } + } + if (option && option.key == 2) { + if (key_word) { + data.key_word = key_word + } } - onFilterClose(prop){ - let data = {} - data[prop] = null; - this.setState(data) + getOrderList(data) + .then((res) => { + handelResponse( + res, + (response, msg) => { + const orderList_data = response.data + const { total } = response + _self.setState({ orderList: orderList_data, total }) + }, + (err) => { + Notify.error(err) + } + ) + }) + .catch((err) => {}) + } + optiononChange(e) { + this.setState({ option: e, key_word: '' }) + } + componentWillMount() { + let datetime = [tomonth + ' ' + '00:00:00', day + ' ' + '23:59:59'] + this.setState({ combinedValue: datetime }) + this.getOrderFn(datetime) + } + + //状态筛选 + selectedId(e, prop) { + let data = {} + if (e == 999) { + data[prop] = null + } else { + data[prop] = e } - - - //获取订单列表 - getOrderFn(time={}){ - let _self=this; - let {page,limit,option,key_word,status}=_self.state; - let data={page,limit} - if(this.state.combinedValue&&this.state.combinedValue[0]){ - data.begin_time=this.state.combinedValue[0]; - data.end_time=this.state.combinedValue[1]; - } - if(status||status===0){ - data.status=status; - } - if(time&&time[0]){ - data.begin_time=time[0]; - data.end_time=time[1]; - } - if(time&&time[0]==null&&time.length>1){ - delete data.begin_time; - delete data.end_time; + this.setState(data) } - if(option&&option.key==1){ - if(key_word){ - data.key=key_word; + onclearFn(e) {} + // 监听组件内部状态的变化: + componentDidUpdate(prevProps, prevState) { + // 参数分别为改变之前的数据状态对象 + if (prevState.key_word != this.state.key_word && !this.state.key_word) { + this.getOrderFn() } - } - if(option&&option.key==2){ - if(key_word){ - data.key_word=key_word; + if (prevState.option != this.state.option && !this.state.option) { + this.getOrderFn() + this.setState({ key_word: '' }) + } + if (prevState.status != this.state.status) { + this.getOrderFn() } - } - - getOrderList(data).then(res=>{ - handelResponse(res,(response,msg)=>{ - const orderList_data=response.data; - const {total}=response; - _self.setState({orderList:orderList_data,total}); - - },(err)=>{ - Notify.error(err) - }) - }).catch(err=>{ - }); - } - optiononChange(e){ - this.setState({option:e,key_word:''}); - } - componentWillMount(){ - let datetime = [ - tomonth + " " + "00:00:00", - day + " " + "23:59:59" - ]; - this.setState({combinedValue:datetime}); - this.getOrderFn(datetime); - } - - //状态筛选 - selectedId(e,prop){ - let data ={} - if(e==999) - { - data[prop] = null; - } - else{ - data[prop] = e - } - - this.setState(data); - } - onclearFn(e){ - - } - // 监听组件内部状态的变化: -componentDidUpdate(prevProps,prevState){ - // 参数分别为改变之前的数据状态对象 - if(prevState.key_word!=this.state.key_word &&!this.state.key_word){ - this.getOrderFn(); } - if(prevState.option!=this.state.option &&!this.state.option){ - this.getOrderFn(); - this.setState({key_word:""}); - } - if(prevState.status!=this.state.status){ - this.getOrderFn(); - } -} //过滤表格枚举状态 - render(){ - - const date = + render() { + const date = ( + + ) - - const { current, pageSize } = this.state; - return( -
- -
-

- {/* + const { current, pageSize } = this.state + return ( +

+ +
+

+ {/* */} - -

-
- this.optiononChange(e)} + disableSearch + options={options} + clearable + placeholder='请选择查询分类' + /> + {/* */} + {this.state.option ? ( + this.state.option.key == '1' ? ( + { + this.setState({ key_word: '' }) + }} + wordSearch={this.sureFn.bind(this)} + onChange={(e) => this.setState({ key_word: e })} + value={this.state.key_word} + icon='search' + placeholder={'请输入key进行搜索'} + countShow={false} + height={'36px'} + width={'260px'} + alignment={'left'} + /> + ) : ( + { + 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'} + /> + ) + ) : null} +
+
+ { + this.onFilterClose(e) + }} + selectFn={(e, prop) => { + this.selectedId(e, prop) + }} + filterList={this.state.filterList} + menuList={this.state.menuList}> +
+ {this.state.selectiondata.length > 0 ? ( + + 清空 + + }> + 已选择 + + {this.state.selectiondata.length} + + 项,官方价金额总计¥{this.state.officialprice.toFixed(4)} + ,合同价金额总计¥{this.state.contractprice.toFixed(4)} + ,成本价金额总计:¥{this.state.costprice.toFixed(4)} + ,结算价金额总计:¥{this.state.totalprice.toFixed(4)} + + ) : null} + { + this.pageChange(e) + }} + countChange={(e) => { + this.countChange(e) + }} + checkChange={this.selection.bind(this)} + ComponentHandler={(com, rowData) => { + if (com == 'cost') { + return ( + + {rowData.contract_price}({rowData.cost_price}) + + ) + } + if (com == 'statusDom') { + return ( +

+ + + {rowData.status_text} + +

+ ) + } + if (com == 'opearo') { + return ( +
+ {rowData.status == 0 || + rowData.status == 1 || + rowData.status == 2 || + rowData.status == 3 ? ( + this.moreFn(e, rowData)}> + 详情 + + ) : null} + {rowData.status == 1 ? ( + this.deleteFn(e, rowData)}> + 作废 + + ) : null} + { + // rowData.status==3? this.againinvestFn(e,rowData)}>再次充值:null + } + {rowData.status == 1 ? ( + this.changeSuccessFn(e, rowData)}> + 改为成功 + + ) : null} +
+ ) + } + }} + /> +
+
) } -} \ No newline at end of file +} diff --git a/src/pages/plan/add/step2.less b/src/pages/plan/add/step2.less index a3005a48..90a64461 100644 --- a/src/pages/plan/add/step2.less +++ b/src/pages/plan/add/step2.less @@ -1,7 +1,6 @@ .draw2 { .zent-card-body { border: none; - padding: 0 !important; } .borderNone { diff --git a/src/pages/plan/knockGold/Dialog.jsx b/src/pages/plan/knockGold/Dialog.jsx index 5e9fca1d..9c850224 100644 --- a/src/pages/plan/knockGold/Dialog.jsx +++ b/src/pages/plan/knockGold/Dialog.jsx @@ -29,14 +29,18 @@ export default ({ data, onChangeMoney }) => { 预估当前剩余余额为 60000.21

- + { - setStateData({ stateData: value }) + setStateData({ addNew: value }) }} onClearItem={() => { - setStateData({ stateData: '' }) + setStateData({ addNew: '' }) }} kind='number' value={stateData.addNew} @@ -46,25 +50,17 @@ export default ({ data, onChangeMoney }) => { height={'36px'} unit='元' countShow={false} - width={'200px'} + width={'260px'} alignment={'left'} /> - + { - setStateData({ stateData: value }) - }} - onClearItem={() => { - setStateData({ stateData: '' }) - }} + onChange={(value) => {}} + onClearItem={() => {}} kind='number' - value={stateData.addNew} + value={''} placeholder={''} labelWidth={'0px'} maxLength={16} diff --git a/src/pages/plan/knockGold/index.jsx b/src/pages/plan/knockGold/index.jsx index 39cb4ca7..930e3cdc 100644 --- a/src/pages/plan/knockGold/index.jsx +++ b/src/pages/plan/knockGold/index.jsx @@ -6,6 +6,7 @@ import Form from '../../../components/form/main' import FormItem from '../../../components/form-item/main' import rules from './rules' import moment from 'moment' +import { uuid } from './utils' import { Select, Button, @@ -18,9 +19,10 @@ import { Card, Dialog, Notify, - Input + Input, + Tag } from 'zent' -import _ from 'lodash' +import _, { isArray } from 'lodash' import AddNewDialog from './Dialog' import MobileComponent from './mobileCmponent' export default class adduserinfo extends React.Component { @@ -29,7 +31,7 @@ export default class adduserinfo extends React.Component { this.state = { model: { //数据模型不可少 - id: '888', + uuid: '', channel: '1', // 渠道 entry_time: '', // 生效时间 expire_time: '', // 过期时间 @@ -48,7 +50,7 @@ export default class adduserinfo extends React.Component { time_limit: '', // '时间限制配置', instruction: '', //'使用说明', early_per: [], //'预警百分比', - early_notifier: '', //'预警通知人', + early_notifier: [], //'预警通知人', create_time: '', // '创建时间', creator: '', // '创建人, addNew: '', //加款 @@ -66,12 +68,35 @@ export default class adduserinfo extends React.Component { loadshow: false, productpic: [], copyEarly_per: '', //预警百分比输入框 - visible: false //加框弹窗 + visible: false, //加框弹窗 + warningInput: '', //预警输入框 + //预警人数据 + userSelectList: [ + { + key: '1', + text: 'Option 1', + closable: true + }, + { + key: '2', + text: 'Option 2', + closable: true + }, + { + key: '3', + text: 'Option 3', + disabled: true + }, + { + key: '4', + text: `君不见,黄河之水天上来,奔流到海不复回`, + closable: false + } + ] } } componentWillMount() { - console.log(this.props.data) if (this.props.data) { let model = this.state.model for (let key in this.props.data) { @@ -115,8 +140,8 @@ export default class adduserinfo extends React.Component { // } } + /* x时间控件禁用 */ onDisabledRange = (date, type) => { - console.log(type) let disabled = false if (type == 'end') { disabled = moment(date.getTime()).add(1, 'days') <= new Date().getTime() @@ -127,6 +152,7 @@ export default class adduserinfo extends React.Component { return disabled } + /* 提交 */ async submit() { if ( this.refs.form.validator() && @@ -141,7 +167,7 @@ export default class adduserinfo extends React.Component { temp = JSON.parse(sessionStorage.getItem('knockGoldData')) let index = temp.findIndex((item) => { - return item.id === this.props.data.id + return item.uuid === this.props.data.uuid }) for (let key in this.state.model) { @@ -174,7 +200,9 @@ export default class adduserinfo extends React.Component { temp = JSON.parse(sessionStorage.getItem('knockGoldData')) } let data = temp ? temp : [] - data.push(this.state.model) + const models = this.state.model + models.uuid = uuid(6, 16) + data.push(models) sessionStorage.setItem('knockGoldData', JSON.stringify(data)) return true } @@ -213,19 +241,40 @@ export default class adduserinfo extends React.Component { //方形单选框事件 /* 方框单选事件 */ - onTypeChange(e, type) { + onTypeChange(e, key) { let model2 = this.state.model - model2[type] = e.target.value + model2[key] = e.target.value this.setState({ model: model2 }) } //输入框输入事件 - onInputChange(value, type) { + onInputChange(value, key) { let model2 = this.state.model - model2[type] = value + model2[key] = value this.setState({ model: model2 }) } + //tag关闭 + closeCallback(item) { + const newData = this.state.model.early_notifier.filter( + (items) => items.key !== item.key + ) + this.onInputChange(newData, 'early_notifier') /* 调用公用setState */ + /* 当预警人为0 清除输入框 */ + if (newData.length < 1) this.setState({ warningInput: '' }) + } + + /* 预警人去重 */ + deWeightThree(data) { + let map = new Map() + for (let item of data) { + if (!map.has(item.key)) { + map.set(item.key, item) + } + } + return [...map.values()] + } + render() { return (
@@ -234,7 +283,7 @@ export default class adduserinfo extends React.Component { { this.onTypeChange(e, 'channel') }} @@ -254,7 +303,7 @@ export default class adduserinfo extends React.Component { onClearItem={() => { this.onInputChange('', 'batch_number') }} - disabled={this.state.model.id ? false : true} + // disabled={this.props?.data?.id ? true : false} value={this.state.model.batch_number} placeholder={'请输入'} labelWidth={'0px'} @@ -276,7 +325,7 @@ export default class adduserinfo extends React.Component { this.onInputChange('', 'batch_goods_name') }} value={this.state.model.batch_goods_name} - disabled={this.state.model.id ? false : true} + // disabled={this.props?.data?.id ? true : false} placeholder={'请输入'} labelWidth={'0px'} maxLength={30} @@ -301,7 +350,7 @@ export default class adduserinfo extends React.Component { labelWidth={'0px'} maxLength={7} height={'36px'} - disabled={this.state.model.id ? false : true} + // disabled={this.props?.data?.id ? true : false} kind='number' width={'520px'} unit='元' @@ -318,7 +367,7 @@ export default class adduserinfo extends React.Component { this.onInputChange('', 'money') }} value={this.state.model.money} - disabled={this.state.model.id ? false : true} + // disabled={this.props?.data?.id ? true : false} placeholder={'请输入'} unit='元' countShow={false} @@ -356,11 +405,11 @@ export default class adduserinfo extends React.Component { placeholder={'请输入'} labelWidth={'0px'} unit='元' - disabled={this.state.model.id ? false : true} + // disabled={this.props?.data?.id ? true : false} countShow={false} maxLength={16} height={'36px'} - width={'200px'} + width={'231px'} alignment={'left'} kind='number' /> @@ -376,11 +425,11 @@ export default class adduserinfo extends React.Component { placeholder={'请输入'} labelWidth={'0px'} unit='元' - disabled={this.state.model.id ? false : true} + // disabled={this.props?.data?.id ? true : false} countShow={false} maxLength={16} height={'36px'} - width={'200px'} + width={'231px'} alignment={'left'} kind='number' /> @@ -396,7 +445,7 @@ export default class adduserinfo extends React.Component { value={this.state.model.all_budget} placeholder={'请输入'} kind='number' - disabled={this.state.model.id ? false : true} + // disabled={this.props?.data?.id ? true : false} labelWidth={'0px'} maxLength={16} height={'36px'} @@ -418,7 +467,7 @@ export default class adduserinfo extends React.Component { onClearItem={() => { this.onInputChange('', 'day_budget') }} - disabled={this.state.model.id ? false : true} + // disabled={this.props?.data?.id ? true : false} value={this.state.model.day_budget} placeholder={'请输入'} labelWidth={'0px'} @@ -442,7 +491,7 @@ export default class adduserinfo extends React.Component { onClearItem={() => { this.onInputChange('', 'receive_number') }} - disabled={this.state.model.id ? false : true} + // disabled={this.props?.data?.id ? true : false} value={this.state.model.receive_number} placeholder={'请输入'} labelWidth={'0px'} @@ -455,7 +504,7 @@ export default class adduserinfo extends React.Component { kind='number' /> { this.onTypeChange(e, 'receive_type') }} @@ -468,7 +517,7 @@ export default class adduserinfo extends React.Component { { this.onInputChange(value, 'card_type') @@ -482,7 +531,7 @@ export default class adduserinfo extends React.Component { labelname='是否开启自然人限制' prop='natural_limit'> { this.onTypeChange(e, 'natural_limit') }} @@ -496,7 +545,7 @@ export default class adduserinfo extends React.Component { labelname='是否开启防刷拦截' prop='brush_limit'> { this.onTypeChange(e, 'brush_limit') }} @@ -518,10 +567,11 @@ export default class adduserinfo extends React.Component { defaultTime: [moment().format('HH:mm:ss'), '23:59:59'] }} format='YYYY-MM-DD HH:mm:ss' - disabled={[ - this.state.model.id ? false : true, - this.state.model.id ? false : true - ]} + // disabled={[ + // this.props?.data?.id ? true : false, + // this.props?.data?.id ? true : false + // ]} + width={245} value={this.state.model.entry_time} onChange={(value) => { this.onInputChange(value, 'entry_time') @@ -538,10 +588,10 @@ export default class adduserinfo extends React.Component { defaultTime: [moment().format('HH:mm:ss'), '23:59:59'] }} format='YYYY-MM-DD HH:mm:ss' - disabled={[ - this.state.model.id ? false : true, - this.state.model.id ? false : true - ]} + // disabled={[ + // this.props?.data?.id ? true : false, + // this.props?.data?.id ? true : false + // ]} value={this.state.model.timer} onChange={(value) => { this.onInputChange(value, 'timer') @@ -552,7 +602,7 @@ export default class adduserinfo extends React.Component { onChange={(e) => { this.onTypeChange(e, 'timer_type') }} - disabled={this.state.model.id ? false : true} + // disabled={this.props?.data?.id ? true : false} value={this.state.model.timer_type}> 不设置 每天 @@ -564,7 +614,7 @@ export default class adduserinfo extends React.Component { onChange={(e) => { this.onTypeChange(e, 'timer_type') }} - disabled={this.state.model.id ? false : true} + // disabled={this.props?.data?.id ? true : false} value={this.state.model.timer_type}> 不设置 每天 @@ -580,7 +630,7 @@ export default class adduserinfo extends React.Component { { this.onInputChange(target.value, 'usable_time') }}> @@ -592,7 +642,7 @@ export default class adduserinfo extends React.Component { clearable options={[]} placeholder='选择一项' - disabled={this.state.model.id ? false : true} + // disabled={this.props?.data?.id ? true : false} />
{ this.onInputChange('', 'product_name') }} - disabled={this.state.model.id ? false : true} + // disabled={this.props?.data?.id ? true : false} value={this.state.model.product_name} placeholder={'请输入'} labelWidth={'0px'} @@ -611,13 +661,13 @@ export default class adduserinfo extends React.Component { height={'36px'} unit='天' countShow={false} - width={'230px'} + width={'292px'} alignment={'left'} />
{ this.onInputChange(target.value, 'usable_time') @@ -631,10 +681,11 @@ export default class adduserinfo extends React.Component { defaultTime: [moment().format('HH:mm:ss'), '23:59:59'] }} format='YYYY-MM-DD HH:mm:ss' - disabled={[ - this.state.model.id ? false : true, - this.state.model.id ? false : true - ]} + // disabled={[ + // this.props?.data?.id ? true : false, + // this.props?.data?.id ? true : false + // ]} + width={195} value={this.state.model.fixed_time} onChange={(value) => { this.onInputChange(value, 'fixed_time') @@ -695,23 +746,44 @@ export default class adduserinfo extends React.Component { height={'36px'} unit='%' countShow={false} - width={'120px'} + width={'190px'} alignment={'left'} /> - - { + const model = this.state.model + /* 防止清除select时报错 is key undefine */ + if (value) { + model.early_notifier.push(value) + model.early_notifier = this.deWeightThree( + model.early_notifier + ) + } + this.setState({ warningInput: value, model: model }) + }} + /> +
+
+
    + {isArray(this.state.model.early_notifier) && + this.state.model.early_notifier?.map((item) => ( + this.closeCallback(item)} + key={item.key}> + {item.text} + + ))} +
+
p { margin: 0; font-size: 12px; @@ -239,32 +247,36 @@ } } + .bt_se { + display: flex; + + button { + margin-left: 10px; + } + } + .userSelect { width: 520px; - height: 200px; + min-height: 150px; border: 1px solid #e4e4e4; margin-top: 20px; - } - .dialog_p { - p { - font-size: 16px; - margin-bottom: 10px; - } + ol { + padding: 10px 5px; - .red { - color: red; - } - - .green { - color: green; - } - - .blue { - color: blue; + .zent-tag { + margin-right: 7px; + margin-bottom: 10px; + padding: 7px; + background-color: #e6efff; + border: #145bd4; + color: #145bd4; + } } } + + #addNew { display: flex; align-items: center; @@ -276,4 +288,35 @@ padding: 0; } } +} + +.dialog_p { + p { + font-size: 16px; + margin-bottom: 10px; + } + + .red { + color: red; + } + + .green { + color: green; + } + + .blue { + color: blue; + } + + .form-compontent { + padding: 0; + } + + .form-Item { + margin: 20px 0; + } + + #addNew1 { + display: none; + } } \ No newline at end of file diff --git a/src/pages/plan/knockGold/mobileCmponent.jsx b/src/pages/plan/knockGold/mobileCmponent.jsx index 5cb5239c..487f5494 100644 --- a/src/pages/plan/knockGold/mobileCmponent.jsx +++ b/src/pages/plan/knockGold/mobileCmponent.jsx @@ -1,5 +1,6 @@ -import { filter } from 'lodash' +import { Placeholder } from 'zent' import './index.less' +const widths = [24, 100, 100, 100, 80, 24, 100, 100, 100, 80, 100, 100, 100, 80] export default ({ data }) => { return (
@@ -19,19 +20,19 @@ export default ({ data }) => { {data.channel === '1' ? '支付宝' : '微信'} {data.batch_goods_name ? data.batch_goods_name : 'xxx'}

-

- 有效期: - {data.entry_time ? data.entry_time[0] : 'xxxx-xx-xx xx:xx:xx'}至 - {data.entry_time ? data.entry_time[1] : 'xxxx-xx-xx xx:xx:xx'} -

- {data.card_type.length > 0 + {data?.card_type.length > 0 ? data.card_type.map( (item) => (item === '1' ? '借记卡' : '信用卡') + ' ' ) : 'xxx xxx xxx'}{' '} 可用

+

+ 有效期: + {data?.entry_time ? data.entry_time[0] : 'xxxx-xx-xx xx:xx:xx'}至 + {data?.entry_time ? data.entry_time[1] : 'xxxx-xx-xx xx:xx:xx'} +

立即领取
@@ -59,7 +60,13 @@ export default ({ data }) => { ) : ( -
使用说明
+ )} diff --git a/src/pages/plan/knockGold/rules.js b/src/pages/plan/knockGold/rules.js index dfd1dbef..4be45f84 100644 --- a/src/pages/plan/knockGold/rules.js +++ b/src/pages/plan/knockGold/rules.js @@ -71,7 +71,14 @@ export default { early_notifier: [{ type: 'required', message: '请选择预警通知人' }] //'预警通知人', }, addNew: { - addNew: [{ type: 'required', message: '请输入加款金额' }] + addNew: [ + { type: 'required', message: '请输入加款金额' }, + { + type: 'regExp', + message: '最多保留2位小数', + reg: '^[0-9]+(.[0-9]{1,2})?$' + } + ] } // quantity: [ // { type: 'required', message: '请输入商品库存' }, diff --git a/src/pages/plan/knockGold/utils.js b/src/pages/plan/knockGold/utils.js new file mode 100644 index 00000000..f71985b1 --- /dev/null +++ b/src/pages/plan/knockGold/utils.js @@ -0,0 +1,31 @@ +/* uuid生成器 */ +export function uuid(len, radix) { + var chars = + '0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz'.split('') + var uuid = [], + i + radix = radix || chars.length + + if (len) { + // Compact form + for (i = 0; i < len; i++) uuid[i] = chars[0 | (Math.random() * radix)] + } else { + // rfc4122, version 4 form + var r + + // rfc4122 requires these characters + uuid[8] = uuid[13] = uuid[18] = uuid[23] = '-' + uuid[14] = '4' + + // Fill in random data. At i==19 set the high bits of clock sequence as + // per rfc4122, sec. 4.1.5 + for (i = 0; i < 36; i++) { + if (!uuid[i]) { + r = 0 | (Math.random() * 16) + uuid[i] = chars[i == 19 ? (r & 0x3) | 0x8 : r] + } + } + } + + return uuid.join('') +}