Skip to content

M
mr-julyedu
Commit f5b2c545 by xuzhenghua
Options

Merge branch 'master' of gitlab.julyedu.com:baiguangyao/mr-julyedu into liveroom

parents b8334bd8 f2af1ac9
Showing with 14793 additions and 50 deletions
.history/src/base/utils/index_20190429094518.js 0 → 100644
import $ from 'jquery'
export const baseUrl = "http://chaoliu.huibada.cn/mc-shopping/api"
export const imgUrl = "http://exotic.gzfenzu.com"
//数组去重
export const unique = (array) => {
var n = []; //一个新的临时数组
//遍历当前数组
for (var i = 0; i < array.length; i++) {
//如果当前数组的第i已经保存进了临时数组，那么跳过，
//否则把当前项push到临时数组里面
if (n.indexOf(array[i]) === -1) n.push(array[i]);
}
return n;
}
export const getToken = () => {
var token = localStorage.getItem('__mall__token__')
if (!token) {
return '7f202776911755d479254e896cd9537265Qo6d7Z8Cpy72Z4Y43S2117ukY4aU1O7585949AaVxTOn37L3522645g0R1P4e8'
return 'eca93750ea21a54fc938b6d3a41d3adfIh0o67S126s58D6KQrfZzZy7fiKOpY8ch17g551bPV8ZO6289UPXs2Op38SQLWk2'
return null
} else {
return token
}
}
export const getJSsdkParams = (cb) => {
var token = localStorage.getItem('__mall__token__')
if (!token) {
token = '7f202776911755d479254e896cd9537265Qo6d7Z8Cpy72Z4Y43S2117ukY4aU1O7585949AaVxTOn37L3522645g0R1P4e8'
token = 'eca93750ea21a54fc938b6d3a41d3adfIh0o67S126s58D6KQrfZzZy7fiKOpY8ch17g551bPV8ZO6289UPXs2Op38SQLWk2'
token = null
}
$.ajax({
type: 'post',
data: {
token: token,
url: 'http://chaoliu.huibada.cn/mc-shopping/index.html'
},
async: false,
url: 'http://chaoliu.huibada.cn/mc-shopping/api/getJsApiSdk',
success(res) {
cb && cb(res)
}
})
}
export const getQueryString = (name) => {
var result = window.location.search.match(new RegExp("[\?\&]" + name + "=([^\&]+)", "i"));
if (result == null || result.length < 1) {
return "";
}
return result[1];
}
export const locationHref = () => {
var userId = getQueryString('userId')
if (userId) {
localStorage.setItem('__mall__userId__', userId)
} else {
localStorage.removeItem('__mall__userId__')
}
var ret_url = "http://chaoliu.huibada.cn/mc-shopping/getLogin.html"
var open_weixin = 'https://open.weixin.qq.com/connect/oauth2/authorize'
var app_id = 'wx36cf3578e22c3eb5'
var oper_url = open_weixin + '?appid=' + app_id + '&redirect_uri=' + ret_url + '&response_type=code&scope=snsapi_userinfo&state=null#wechat_redirect'
return oper_url
}
export const formatTime = (date) => {
var year = date.getFullYear()
var month = date.getMonth() + 1
var day = date.getDate()
return [year, month, day].join('-')
}
export const formatDate = (now, fmt) => {
var now = new Date(now);
var fmt = fmt ? fmt : 'yyyy-MM-dd hh:mm:ss';
var o = {
"M+": now.getMonth() + 1, //月份
"d+": now.getDate(), //日
"h+": now.getHours(), //小时
"m+": now.getMinutes(), //分
"s+": now.getSeconds(), //秒
"q+": Math.floor((now.getMonth() + 3) / 3), //季度
"S": now.getMilliseconds() //毫秒
};
if (/(y+)/.test(fmt)) {
fmt = fmt.replace(RegExp.$1, (now.getFullYear() + "").substr(4 - RegExp.$1.length));
}
for (var k in o) {
if (new RegExp("(" + k + ")").test(fmt)) {
fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
}
}
return fmt;
}
// 计算时间相差fn(过去距离当前时间)
export const computingTime = (pastTime) => {
var currentTime = (new Date()).getTime(),
distanceTime = currentTime - pastTime,
// 计算相差天数
days = Math.floor(distanceTime / (24 * 3600 * 1000)),
// 计算相差小时数
leave1 = distanceTime % (24 * 3600 * 1000),
hours = Math.floor(leave1 / (3600 * 1000)),
// 计算相差分钟数
leave2 = leave1 % (3600 * 1000),
minutes = Math.floor(leave2 / (60 * 1000)),
// 计算相差毫秒数
leave3 = leave2 % (60 * 1000),
seconds = Math.round(leave3 / 1000),
// 处理返回格式
dayStr = days <= 0 ? "" : days + "天",
hourStr = hours <= 0 ? "" : hours + "小时",
minuteStr = minutes <= 0 ? "" : minutes + "分钟",
secondStr = (days <= 0 && hours <= 0 && minutes <= 0) ? "刚刚" : "前";
// secondStr=seconds==0?"":seconds+"秒";
if (days >= 1) {
return dayStr + '前';
} else {
return dayStr + hourStr + minuteStr + secondStr;
}
}
// 时间倒计时 (未来距离现在)
export const timeDown = (endDate) => {
var now = new Date();
var leftTime = endDate - now.getTime();
var leftsecond = parseInt(leftTime / 1000);
var day1 = Math.floor(leftsecond / (60 * 60 * 24));
var hour = Math.floor((leftsecond - day1 * 24 * 60 * 60) / 3600);
var minute = Math.floor((leftsecond - day1 * 24 * 60 * 60 - hour * 3600) / 60);
var second = Math.floor(leftsecond - day1 * 24 * 60 * 60 - hour * 3600 - minute * 60);
hour = hour >= 10 ? hour : '0' + hour;
minute = minute >= 10 ? minute : '0' + minute;
second = second >= 10 ? second : '0' + second;
return day1 + '天' + hour + ':' + minute + ':' + second;
return leftTime;
}
// 去除字符串首尾空格
export const strTrim = (s) => {
return s.replace(/(^\s*)|(\s*$)/g, "");
}
export const isPhone = ($poneInput) => {
var myreg = /^[1][3,4,5,7,8][0-9]{9}$/;
if (!myreg.test($poneInput)) {
return true;
} else {
return false;
}
}
\ No newline at end of file
.history/src/base/utils/index_20190429094532.js 0 → 100644
import $ from 'jquery'
export const baseUrl = "http://chaoliu.huibada.cn/mc-shopping/api"
export const imgUrl = "http://exotic.gzfenzu.com"
//数组去重
export const unique = (array) => {
var n = []; //一个新的临时数组
//遍历当前数组
for (var i = 0; i < array.length; i++) {
//如果当前数组的第i已经保存进了临时数组，那么跳过，
//否则把当前项push到临时数组里面
if (n.indexOf(array[i]) === -1) n.push(array[i]);
}
return n;
}
export const getToken = () => {
var token = localStorage.getItem('__mall__token__')
if (!token) {
return '7f202776911755d479254e896cd9537265Qo6d7Z8Cpy72Z4Y43S2117ukY4aU1O7585949AaVxTOn37L3522645g0R1P4e8'
return 'eca93750ea21a54fc938b6d3a41d3adfIh0o67S126s58D6KQrfZzZy7fiKOpY8ch17g551bPV8ZO6289UPXs2Op38SQLWk2'
return null
} else {
return token
}
}
export const getJSsdkParams = (cb) => {
var token = localStorage.getItem('__mall__token__')
if (!token) {
token = '7f202776911755d479254e896cd9537265Qo6d7Z8Cpy72Z4Y43S2117ukY4aU1O7585949AaVxTOn37L3522645g0R1P4e8'
token = 'eca93750ea21a54fc938b6d3a41d3adfIh0o67S126s58D6KQrfZzZy7fiKOpY8ch17g551bPV8ZO6289UPXs2Op38SQLWk2'
token = null
}
$.ajax({
type: 'post',
data: {
token: token,
url: 'http://chaoliu.huibada.cn/mc-shopping/index.html'
},
async: false,
url: 'http://chaoliu.huibada.cn/mc-shopping/api/getJsApiSdk',
success(res) {
cb && cb(res)
}
})
}
export const getQueryString = (name) => {
var result = window.location.search.match(new RegExp("[\?\&]" + name + "=([^\&]+)", "i"));
if (result == null || result.length < 1) {
return "";
}
return result[1];
}
export const formatTime = (date) => {
var year = date.getFullYear()
var month = date.getMonth() + 1
var day = date.getDate()
return [year, month, day].join('-')
}
export const formatDate = (now, fmt) => {
var now = new Date(now);
var fmt = fmt ? fmt : 'yyyy-MM-dd hh:mm:ss';
var o = {
"M+": now.getMonth() + 1, //月份
"d+": now.getDate(), //日
"h+": now.getHours(), //小时
"m+": now.getMinutes(), //分
"s+": now.getSeconds(), //秒
"q+": Math.floor((now.getMonth() + 3) / 3), //季度
"S": now.getMilliseconds() //毫秒
};
if (/(y+)/.test(fmt)) {
fmt = fmt.replace(RegExp.$1, (now.getFullYear() + "").substr(4 - RegExp.$1.length));
}
for (var k in o) {
if (new RegExp("(" + k + ")").test(fmt)) {
fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
}
}
return fmt;
}
// 计算时间相差fn(过去距离当前时间)
export const computingTime = (pastTime) => {
var currentTime = (new Date()).getTime(),
distanceTime = currentTime - pastTime,
// 计算相差天数
days = Math.floor(distanceTime / (24 * 3600 * 1000)),
// 计算相差小时数
leave1 = distanceTime % (24 * 3600 * 1000),
hours = Math.floor(leave1 / (3600 * 1000)),
// 计算相差分钟数
leave2 = leave1 % (3600 * 1000),
minutes = Math.floor(leave2 / (60 * 1000)),
// 计算相差毫秒数
leave3 = leave2 % (60 * 1000),
seconds = Math.round(leave3 / 1000),
// 处理返回格式
dayStr = days <= 0 ? "" : days + "天",
hourStr = hours <= 0 ? "" : hours + "小时",
minuteStr = minutes <= 0 ? "" : minutes + "分钟",
secondStr = (days <= 0 && hours <= 0 && minutes <= 0) ? "刚刚" : "前";
// secondStr=seconds==0?"":seconds+"秒";
if (days >= 1) {
return dayStr + '前';
} else {
return dayStr + hourStr + minuteStr + secondStr;
}
}
// 时间倒计时 (未来距离现在)
export const timeDown = (endDate) => {
var now = new Date();
var leftTime = endDate - now.getTime();
var leftsecond = parseInt(leftTime / 1000);
var day1 = Math.floor(leftsecond / (60 * 60 * 24));
var hour = Math.floor((leftsecond - day1 * 24 * 60 * 60) / 3600);
var minute = Math.floor((leftsecond - day1 * 24 * 60 * 60 - hour * 3600) / 60);
var second = Math.floor(leftsecond - day1 * 24 * 60 * 60 - hour * 3600 - minute * 60);
hour = hour >= 10 ? hour : '0' + hour;
minute = minute >= 10 ? minute : '0' + minute;
second = second >= 10 ? second : '0' + second;
return day1 + '天' + hour + ':' + minute + ':' + second;
return leftTime;
}
// 去除字符串首尾空格
export const strTrim = (s) => {
return s.replace(/(^\s*)|(\s*$)/g, "");
}
export const isPhone = ($poneInput) => {
var myreg = /^[1][3,4,5,7,8][0-9]{9}$/;
if (!myreg.test($poneInput)) {
return true;
} else {
return false;
}
}
\ No newline at end of file
.history/src/base/utils/index_20190429094539.js 0 → 100644
import $ from 'jquery'
export const baseUrl = "http://chaoliu.huibada.cn/mc-shopping/api"
export const imgUrl = "http://exotic.gzfenzu.com"
//数组去重
export const unique = (array) => {
var n = []; //一个新的临时数组
//遍历当前数组
for (var i = 0; i < array.length; i++) {
//如果当前数组的第i已经保存进了临时数组，那么跳过，
//否则把当前项push到临时数组里面
if (n.indexOf(array[i]) === -1) n.push(array[i]);
}
return n;
}
export const getToken = () => {
var token = localStorage.getItem('__mall__token__')
if (!token) {
return '7f202776911755d479254e896cd9537265Qo6d7Z8Cpy72Z4Y43S2117ukY4aU1O7585949AaVxTOn37L3522645g0R1P4e8'
return 'eca93750ea21a54fc938b6d3a41d3adfIh0o67S126s58D6KQrfZzZy7fiKOpY8ch17g551bPV8ZO6289UPXs2Op38SQLWk2'
return null
} else {
return token
}
}
export const getJSsdkParams = (cb) => {
var token = localStorage.getItem('__mall__token__')
if (!token) {
token = '7f202776911755d479254e896cd9537265Qo6d7Z8Cpy72Z4Y43S2117ukY4aU1O7585949AaVxTOn37L3522645g0R1P4e8'
token = 'eca93750ea21a54fc938b6d3a41d3adfIh0o67S126s58D6KQrfZzZy7fiKOpY8ch17g551bPV8ZO6289UPXs2Op38SQLWk2'
token = null
}
$.ajax({
type: 'post',
data: {
token: token,
url: 'http://chaoliu.huibada.cn/mc-shopping/index.html'
},
async: false,
url: 'http://chaoliu.huibada.cn/mc-shopping/api/getJsApiSdk',
success(res) {
cb && cb(res)
}
})
}
export const formatTime = (date) => {
var year = date.getFullYear()
var month = date.getMonth() + 1
var day = date.getDate()
return [year, month, day].join('-')
}
export const formatDate = (now, fmt) => {
var now = new Date(now);
var fmt = fmt ? fmt : 'yyyy-MM-dd hh:mm:ss';
var o = {
"M+": now.getMonth() + 1, //月份
"d+": now.getDate(), //日
"h+": now.getHours(), //小时
"m+": now.getMinutes(), //分
"s+": now.getSeconds(), //秒
"q+": Math.floor((now.getMonth() + 3) / 3), //季度
"S": now.getMilliseconds() //毫秒
};
if (/(y+)/.test(fmt)) {
fmt = fmt.replace(RegExp.$1, (now.getFullYear() + "").substr(4 - RegExp.$1.length));
}
for (var k in o) {
if (new RegExp("(" + k + ")").test(fmt)) {
fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
}
}
return fmt;
}
// 计算时间相差fn(过去距离当前时间)
export const computingTime = (pastTime) => {
var currentTime = (new Date()).getTime(),
distanceTime = currentTime - pastTime,
// 计算相差天数
days = Math.floor(distanceTime / (24 * 3600 * 1000)),
// 计算相差小时数
leave1 = distanceTime % (24 * 3600 * 1000),
hours = Math.floor(leave1 / (3600 * 1000)),
// 计算相差分钟数
leave2 = leave1 % (3600 * 1000),
minutes = Math.floor(leave2 / (60 * 1000)),
// 计算相差毫秒数
leave3 = leave2 % (60 * 1000),
seconds = Math.round(leave3 / 1000),
// 处理返回格式
dayStr = days <= 0 ? "" : days + "天",
hourStr = hours <= 0 ? "" : hours + "小时",
minuteStr = minutes <= 0 ? "" : minutes + "分钟",
secondStr = (days <= 0 && hours <= 0 && minutes <= 0) ? "刚刚" : "前";
// secondStr=seconds==0?"":seconds+"秒";
if (days >= 1) {
return dayStr + '前';
} else {
return dayStr + hourStr + minuteStr + secondStr;
}
}
// 时间倒计时 (未来距离现在)
export const timeDown = (endDate) => {
var now = new Date();
var leftTime = endDate - now.getTime();
var leftsecond = parseInt(leftTime / 1000);
var day1 = Math.floor(leftsecond / (60 * 60 * 24));
var hour = Math.floor((leftsecond - day1 * 24 * 60 * 60) / 3600);
var minute = Math.floor((leftsecond - day1 * 24 * 60 * 60 - hour * 3600) / 60);
var second = Math.floor(leftsecond - day1 * 24 * 60 * 60 - hour * 3600 - minute * 60);
hour = hour >= 10 ? hour : '0' + hour;
minute = minute >= 10 ? minute : '0' + minute;
second = second >= 10 ? second : '0' + second;
return day1 + '天' + hour + ':' + minute + ':' + second;
return leftTime;
}
// 去除字符串首尾空格
export const strTrim = (s) => {
return s.replace(/(^\s*)|(\s*$)/g, "");
}
export const isPhone = ($poneInput) => {
var myreg = /^[1][3,4,5,7,8][0-9]{9}$/;
if (!myreg.test($poneInput)) {
return true;
} else {
return false;
}
}
\ No newline at end of file
.history/src/base/utils/index_20190429094552.js 0 → 100644
import $ from 'jquery'
export const baseUrl = "http://chaoliu.huibada.cn/mc-shopping/api"
export const imgUrl = "http://exotic.gzfenzu.com"
//数组去重
export const unique = (array) => {
var n = []; //一个新的临时数组
//遍历当前数组
for (var i = 0; i < array.length; i++) {
//如果当前数组的第i已经保存进了临时数组，那么跳过，
//否则把当前项push到临时数组里面
if (n.indexOf(array[i]) === -1) n.push(array[i]);
}
return n;
}
export const formatTime = (date) => {
var year = date.getFullYear()
var month = date.getMonth() + 1
var day = date.getDate()
return [year, month, day].join('-')
}
export const formatDate = (now, fmt) => {
var now = new Date(now);
var fmt = fmt ? fmt : 'yyyy-MM-dd hh:mm:ss';
var o = {
"M+": now.getMonth() + 1, //月份
"d+": now.getDate(), //日
"h+": now.getHours(), //小时
"m+": now.getMinutes(), //分
"s+": now.getSeconds(), //秒
"q+": Math.floor((now.getMonth() + 3) / 3), //季度
"S": now.getMilliseconds() //毫秒
};
if (/(y+)/.test(fmt)) {
fmt = fmt.replace(RegExp.$1, (now.getFullYear() + "").substr(4 - RegExp.$1.length));
}
for (var k in o) {
if (new RegExp("(" + k + ")").test(fmt)) {
fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
}
}
return fmt;
}
// 计算时间相差fn(过去距离当前时间)
export const computingTime = (pastTime) => {
var currentTime = (new Date()).getTime(),
distanceTime = currentTime - pastTime,
// 计算相差天数
days = Math.floor(distanceTime / (24 * 3600 * 1000)),
// 计算相差小时数
leave1 = distanceTime % (24 * 3600 * 1000),
hours = Math.floor(leave1 / (3600 * 1000)),
// 计算相差分钟数
leave2 = leave1 % (3600 * 1000),
minutes = Math.floor(leave2 / (60 * 1000)),
// 计算相差毫秒数
leave3 = leave2 % (60 * 1000),
seconds = Math.round(leave3 / 1000),
// 处理返回格式
dayStr = days <= 0 ? "" : days + "天",
hourStr = hours <= 0 ? "" : hours + "小时",
minuteStr = minutes <= 0 ? "" : minutes + "分钟",
secondStr = (days <= 0 && hours <= 0 && minutes <= 0) ? "刚刚" : "前";
// secondStr=seconds==0?"":seconds+"秒";
if (days >= 1) {
return dayStr + '前';
} else {
return dayStr + hourStr + minuteStr + secondStr;
}
}
// 时间倒计时 (未来距离现在)
export const timeDown = (endDate) => {
var now = new Date();
var leftTime = endDate - now.getTime();
var leftsecond = parseInt(leftTime / 1000);
var day1 = Math.floor(leftsecond / (60 * 60 * 24));
var hour = Math.floor((leftsecond - day1 * 24 * 60 * 60) / 3600);
var minute = Math.floor((leftsecond - day1 * 24 * 60 * 60 - hour * 3600) / 60);
var second = Math.floor(leftsecond - day1 * 24 * 60 * 60 - hour * 3600 - minute * 60);
hour = hour >= 10 ? hour : '0' + hour;
minute = minute >= 10 ? minute : '0' + minute;
second = second >= 10 ? second : '0' + second;
return day1 + '天' + hour + ':' + minute + ':' + second;
return leftTime;
}
// 去除字符串首尾空格
export const strTrim = (s) => {
return s.replace(/(^\s*)|(\s*$)/g, "");
}
export const isPhone = ($poneInput) => {
var myreg = /^[1][3,4,5,7,8][0-9]{9}$/;
if (!myreg.test($poneInput)) {
return true;
} else {
return false;
}
}
\ No newline at end of file
.history/src/base/utils/index_20190429094602.js 0 → 100644
//数组去重
export const unique = (array) => {
var n = []; //一个新的临时数组
//遍历当前数组
for (var i = 0; i < array.length; i++) {
//如果当前数组的第i已经保存进了临时数组，那么跳过，
//否则把当前项push到临时数组里面
if (n.indexOf(array[i]) === -1) n.push(array[i]);
}
return n;
}
export const formatTime = (date) => {
var year = date.getFullYear()
var month = date.getMonth() + 1
var day = date.getDate()
return [year, month, day].join('-')
}
export const formatDate = (now, fmt) => {
var now = new Date(now);
var fmt = fmt ? fmt : 'yyyy-MM-dd hh:mm:ss';
var o = {
"M+": now.getMonth() + 1, //月份
"d+": now.getDate(), //日
"h+": now.getHours(), //小时
"m+": now.getMinutes(), //分
"s+": now.getSeconds(), //秒
"q+": Math.floor((now.getMonth() + 3) / 3), //季度
"S": now.getMilliseconds() //毫秒
};
if (/(y+)/.test(fmt)) {
fmt = fmt.replace(RegExp.$1, (now.getFullYear() + "").substr(4 - RegExp.$1.length));
}
for (var k in o) {
if (new RegExp("(" + k + ")").test(fmt)) {
fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
}
}
return fmt;
}
// 计算时间相差fn(过去距离当前时间)
export const computingTime = (pastTime) => {
var currentTime = (new Date()).getTime(),
distanceTime = currentTime - pastTime,
// 计算相差天数
days = Math.floor(distanceTime / (24 * 3600 * 1000)),
// 计算相差小时数
leave1 = distanceTime % (24 * 3600 * 1000),
hours = Math.floor(leave1 / (3600 * 1000)),
// 计算相差分钟数
leave2 = leave1 % (3600 * 1000),
minutes = Math.floor(leave2 / (60 * 1000)),
// 计算相差毫秒数
leave3 = leave2 % (60 * 1000),
seconds = Math.round(leave3 / 1000),
// 处理返回格式
dayStr = days <= 0 ? "" : days + "天",
hourStr = hours <= 0 ? "" : hours + "小时",
minuteStr = minutes <= 0 ? "" : minutes + "分钟",
secondStr = (days <= 0 && hours <= 0 && minutes <= 0) ? "刚刚" : "前";
// secondStr=seconds==0?"":seconds+"秒";
if (days >= 1) {
return dayStr + '前';
} else {
return dayStr + hourStr + minuteStr + secondStr;
}
}
// 时间倒计时 (未来距离现在)
export const timeDown = (endDate) => {
var now = new Date();
var leftTime = endDate - now.getTime();
var leftsecond = parseInt(leftTime / 1000);
var day1 = Math.floor(leftsecond / (60 * 60 * 24));
var hour = Math.floor((leftsecond - day1 * 24 * 60 * 60) / 3600);
var minute = Math.floor((leftsecond - day1 * 24 * 60 * 60 - hour * 3600) / 60);
var second = Math.floor(leftsecond - day1 * 24 * 60 * 60 - hour * 3600 - minute * 60);
hour = hour >= 10 ? hour : '0' + hour;
minute = minute >= 10 ? minute : '0' + minute;
second = second >= 10 ? second : '0' + second;
return day1 + '天' + hour + ':' + minute + ':' + second;
return leftTime;
}
// 去除字符串首尾空格
export const strTrim = (s) => {
return s.replace(/(^\s*)|(\s*$)/g, "");
}
export const isPhone = ($poneInput) => {
var myreg = /^[1][3,4,5,7,8][0-9]{9}$/;
if (!myreg.test($poneInput)) {
return true;
} else {
return false;
}
}
\ No newline at end of file
.history/src/base/utils/index_20190429094639.js 0 → 100644
//数组去重
export const unique = (array) => {
var n = []; //一个新的临时数组
//遍历当前数组
for (var i = 0; i < array.length; i++) {
//如果当前数组的第i已经保存进了临时数组，那么跳过，
//否则把当前项push到临时数组里面
if (n.indexOf(array[i]) === -1) n.push(array[i]);
}
return n;
}
export const formatTime = (date) => {
var year = date.getFullYear()
var month = date.getMonth() + 1
var day = date.getDate()
return [year, month, day].join('-')
}
// 计算时间相差fn(过去距离当前时间)
export const computingTime = (pastTime) => {
var currentTime = (new Date()).getTime(),
distanceTime = currentTime - pastTime,
// 计算相差天数
days = Math.floor(distanceTime / (24 * 3600 * 1000)),
// 计算相差小时数
leave1 = distanceTime % (24 * 3600 * 1000),
hours = Math.floor(leave1 / (3600 * 1000)),
// 计算相差分钟数
leave2 = leave1 % (3600 * 1000),
minutes = Math.floor(leave2 / (60 * 1000)),
// 计算相差毫秒数
leave3 = leave2 % (60 * 1000),
seconds = Math.round(leave3 / 1000),
// 处理返回格式
dayStr = days <= 0 ? "" : days + "天",
hourStr = hours <= 0 ? "" : hours + "小时",
minuteStr = minutes <= 0 ? "" : minutes + "分钟",
secondStr = (days <= 0 && hours <= 0 && minutes <= 0) ? "刚刚" : "前";
// secondStr=seconds==0?"":seconds+"秒";
if (days >= 1) {
return dayStr + '前';
} else {
return dayStr + hourStr + minuteStr + secondStr;
}
}
// 时间倒计时 (未来距离现在)
export const timeDown = (endDate) => {
var now = new Date();
var leftTime = endDate - now.getTime();
var leftsecond = parseInt(leftTime / 1000);
var day1 = Math.floor(leftsecond / (60 * 60 * 24));
var hour = Math.floor((leftsecond - day1 * 24 * 60 * 60) / 3600);
var minute = Math.floor((leftsecond - day1 * 24 * 60 * 60 - hour * 3600) / 60);
var second = Math.floor(leftsecond - day1 * 24 * 60 * 60 - hour * 3600 - minute * 60);
hour = hour >= 10 ? hour : '0' + hour;
minute = minute >= 10 ? minute : '0' + minute;
second = second >= 10 ? second : '0' + second;
return day1 + '天' + hour + ':' + minute + ':' + second;
return leftTime;
}
// 去除字符串首尾空格
export const strTrim = (s) => {
return s.replace(/(^\s*)|(\s*$)/g, "");
}
export const isPhone = ($poneInput) => {
var myreg = /^[1][3,4,5,7,8][0-9]{9}$/;
if (!myreg.test($poneInput)) {
return true;
} else {
return false;
}
}
\ No newline at end of file
.history/src/common/OrderList/orderlist_20190429144221.scss 0 → 100644
.public-list-item{
margin-top: 5px;
background: $bg_fff;
.public-content{
display: flex;
height: 100%;
// margin: 0px 15px;
padding: 10px 0;
.public-cover{
flex: 1 0 auto;
margin-right: 15px;
position: relative;
img{
width: 125px;
height: 90px;
border-radius: 3px;
}
}
}
}
.public-list-item:first-child{
margin-top: 0px;
}
.history/src/components/order/index_20190429144504.js 0 → 100644
import React, { Component } from 'react';
import { Flex, NavBar, List } from 'antd-mobile';
import { OrderItem } from '@/common/index'
import "./order.scss"
const Item = List.Item;
const mockData = [
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110'
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110'
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110'
}
]
function OrderList(props) {
const listData = props.list;
return (
<div style={{"padding": "0 15px"}}>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
return (
<OrderItem {...item} key={index} info={Info}>
<div className="order-prefer">
<List key={index}>
<Item
arrow="horizontal"
onClick={() => { }}
>
优惠券
</Item>
</List>
</div>
</OrderItem>
)
})
}
</div>
);
}
class Order extends Component {
constructor(props) {
super(props);
this.state = {
}
}
handleClick = () => {
console.log(1);
}
render() {
return (
<div className="order-wrapper">
<Flex>
<Flex.Item>
<NavBar
style={{"height": "44px"}}
className="order-tab"
mode="light"
icon={<i className="iconfont iconiconfront-68"></i>}
>
课程报名
</NavBar>
<div className="order-information">
<i className="iconfont iconiconfront-6 order-addsize"></i>
<div className="order-infotext">完善报名信息</div>
<i className="iconfont iconiconfront-70 order-next"></i>
</div>
<div className="order-information">
<i className="iconfont iconiconfront-20"></i>
<div className="order-cell">
<div className="name">姓名: 张三</div>
<div>电话: 13266532323</div>
</div>
<div className="order-cell">
<div>QQ: 1084251364</div>
</div>
</div>
<div className="order-list">
<OrderList list={mockData}/>
</div>
<div className="order-balance">
<List>
<Item
onClick={() => { }}
className="order-prefer-text"
extra={<i className="iconfont icondanseshixintubiao-5"></i>}
>
余额抵扣
<span className="order-balanceprice">(账户余额: <i className="order-money">1元</i>)</span>
<i className="iconfont iconiconfront-22"></i>
</Item>
</List>
</div>
<div className="order-bar">
<div className="order-course">
<span className="order-course-text">2门课程</span>
</div>
<div className="order-bar-text">
<div className="order-amount">
<span className="order-amount-title">合计:</span>
<span className="order-amount-price">¥ 30.50</span>
</div>
<div className="order-preprice">
<span className="order-preprice-title">已优惠:</span>
<span className="order-preprice-price">¥ 200.50</span>
</div>
</div>
<button type="button" className="order-button ">
<span className="order-button-text">提交订单</span>
</button>
</div>
</Flex.Item>
</Flex>
</div>
)
}
}
export default Order;
\ No newline at end of file
.history/src/components/order/order_20190429144520.scss 0 → 100644
.order-wrapper{
width: 100%;
margin-bottom: 50px;
background-color: $bg_f5f5f5;
}
.order-tab{
color: $black;
background: $bg_f7f9fc;
}
.order-information{
display: flex;
width: 100%;
overflow: hidden;
padding: 28px 15px;
color: $color_555;
background-color: $bg_fff;
position: relative;
}
.order-information::before{
content: '';
left: 0;
right: 0;
bottom: 0;
height: 2px;
position: absolute;
background: -webkit-repeating-linear-gradient(135deg, #ff6c6c 0, #ff6c6c 20%, transparent 0, transparent 25%, #1989fa 0, #1989fa 45%, transparent 0, transparent 50%);
background: repeating-linear-gradient(-45deg, #ff6c6c 0, #ff6c6c 20%, transparent 0, transparent 25%, #1989fa 0, #1989fa 45%, transparent 0, transparent 50%);
background-size: 80px;
}
.order-cell{
width: 50%;
font-size: $font_14;
color: $color_333;
margin-left: 20px;
line-height: 20px;
display: inline-block;
vertical-align: middle;
.name{
margin-bottom: 10px;
}
}
.order-addsize{
font-size: 32px !important;
margin-bottom: 0px;
color: $active;
}
.order-next{
line-height: 48px;
margin-bottom: 0px;
}
.order-list{
margin-top: 8px;
background-color: $white;
}
.order-infotext{
flex: 1;
line-height: 48px;
margin-left: 10px;
font-size: $font_16;
color: $color_555;
}
.order-info {
color: $color_666;
font-size: $font_14;
.order-title{
height: 16px;
line-height: 16px;
color: $color_333;
font-size: $font_16;
}
.order-content{
margin-top: 10px;
color: $color_666;
font-size: $font_14;
line-height: 18px;
}
.order-des{
margin-top: 10px;
}
.order-newprice{
color: $redprice;
font-size: $font_16;
margin-right: 15px;
}
.order-price{
color: $color_999;
font-size: $font_12;
text-decoration: line-through;
}
}
.order-bar{
height: 50px;
display: flex;
font-size: 14px;
align-items: center;
background-color: $bg_fff;
margin-top: 30%;
}
.order-course{
margin-left: 20px;
.order-course-text{
font-size: $font_16;
color: $color_333;
}
}
.order-bar-text{
flex: 1;
font-weight: 500;
text-align: right;
color: #323233;
padding-right: 12px;
.order-amount{
font-size: $font_14;
color: $color_333;
.order-amount-price{
color: $redprice;
}
}
.order-preprice{
font-size: $font_12;
color: $color_555;
}
}
.order-button{
width: 110px;
height: 50px;
display: inline-block;
position: relative;
padding: 0;
background-color: $bg_ff9898;
color: $white;
line-height: 48px;
font-size: 16px;
border-radius: 0px;
text-align: center;
box-sizing: border-box;
-webkit-appearance: none;
-webkit-text-size-adjust: 100%;
border: 1px solid transparent;
}
.order-button-text{
}
.order-item{
.am-list-item{
padding-left: 15px;
}
}
.v-list-item {
margin-top: 8px;
padding: 10px 15px 0 15px;
.content{
border-bottom: none;
}
}
.order-prefer{
.am-list{
border-top: 1px solid #e7eaf1;
}
.order-prefer-text{
}
}
.order-balanceprice{
color: $color_666;
font-size: $font_12;
.order-money{
color: #ff2121;
font-size: $font_12 !important;
font-weight: normal;
font-style: inherit;
vertical-align: middle;
margin: 0;
}
}
.am-list-item .am-list-line .am-list-content{
color: $color_333;
}
.order-balance{
margin-top: 8px;
.am-list-content{
color: $color_333;
font-size: $font_16;
}
}
\ No newline at end of file
.history/src/components/shopCard/cardItem_20190429094741.js 0 → 100644
import React, { Component } from 'react'
import { connect } from 'react-redux'
import { bindActionCreators } from 'redux'
import * as loadAction from '@actions/loadAction'
import { withRouter } from 'react-router-dom'
import { Checkbox, Stepper, SwipeAction, Toast, Modal } from 'antd-mobile'
import { baseUrl, imgUrl, getToken } from '@common/js/util'
class CratItem extends Component {
//构造函数
constructor(props) {
super(props)
this.state = {
val: props.item.value
}
}
//改变选择
onChange(e, id) {
let checked = e.target.checked;
// console.log(checked,id)
this.props.checkChange(id, checked)
}
//修改购物车
editCart(it, val) {
}
//删除购物车
delete(id) {
var that = this;
Modal.alert('提示', '是否删除该商品？', [
{ text: '取消', onPress: () => console.log('cancel'), style: 'default' },
{
text: '确认', onPress: () => {
}
},
])
}
//跳转
goto(id) {
this.props.history.push('/goods/' + id)
sessionStorage.setItem('__search_prev_path__', this.props.location.pathname)
sessionStorage.setItem('__goods_prev_path__', this.props.location.pathname)
}
//render
render() {
let item = this.props.item
return (
<SwipeAction
autoClose={true}
style={{ backgroundColor: '#f5f5f9', paddingBottom: '10px' }}
right={[
{
text: '删除',
onPress: () => {
console.log('delete')
this.delete(item.id)
return false;
},
style: { backgroundColor: '#F4333C', color: 'white' },
},
]}
onOpen={() => console.log('global open')}
onClose={() => {
console.log('global close')
return false;
}}
>
<div className="cart-c-item" >
<div className="cart-c-check">
<Checkbox checked={item.check} onChange={(e) => {
this.onChange(e, item.id)
}} />
</div>
{/* 商品图片 */}
<div className="cart-ci-left" onClick={() => {
this.goto(item.productId)
}}>
<img src={imgUrl + item.productThumbnail} alt={item.productName} />
</div>
{/* 商品信息 */}
<div className="cart-ci-right">
<div className="r-title"><span>{item.productName}</span></div>
<div className="r-step">
<span className="r-price"><span>￥</span>{item.productSalesPrice.toFixed(2)}</span>
<span className="span-stepper">
{/* 加减步进器 */}
<Stepper
style={{ maxWidth: '100px', height: '30px' }}
showNumber
max={item.stockNum}
min={1}
value={item.value}
onChange={(val) => {
if (val > item.stockNum) {
Toast.info("库存不足", 1)
this.props.changeStock(item.id, item.stockNum)
this.editCart(item, val)
} else {
this.props.changeStock(item.id, val)
this.editCart(item, val)
}
}}
/>
</span>
</div>
</div>
</div>
</SwipeAction>
)
}
}
export default connect(
null,
(dispatch) => {
return {
load: bindActionCreators(loadAction, dispatch)
}
}
)(withRouter(CratItem))
\ No newline at end of file
.history/src/components/shopCard/cardItem_20190429094753.js 0 → 100644
import React, { Component } from 'react'
import { connect } from 'react-redux'
import { bindActionCreators } from 'redux'
import * as loadAction from '@actions/loadAction'
import { withRouter } from 'react-router-dom'
import { Checkbox, Stepper, SwipeAction, Toast, Modal } from 'antd-mobile'
import { baseUrl, imgUrl, getToken } from '@common/js/util'
class CratItem extends Component {
// 构造函数
constructor(props) {
super(props)
this.state = {
val: props.item.value
}
}
// 改变选择
onChange(e, id) {
let checked = e.target.checked;
// console.log(checked,id)
this.props.checkChange(id, checked)
}
// 修改购物车
editCart(it, val) {
}
// 删除购物车
delete(id) {
var that = this;
}
//跳转
goto(id) {
this.props.history.push('/goods/' + id)
sessionStorage.setItem('__search_prev_path__', this.props.location.pathname)
sessionStorage.setItem('__goods_prev_path__', this.props.location.pathname)
}
//render
render() {
let item = this.props.item
return (
<SwipeAction
autoClose={true}
style={{ backgroundColor: '#f5f5f9', paddingBottom: '10px' }}
right={[
{
text: '删除',
onPress: () => {
console.log('delete')
this.delete(item.id)
return false;
},
style: { backgroundColor: '#F4333C', color: 'white' },
},
]}
onOpen={() => console.log('global open')}
onClose={() => {
console.log('global close')
return false;
}}
>
<div className="cart-c-item" >
<div className="cart-c-check">
<Checkbox checked={item.check} onChange={(e) => {
this.onChange(e, item.id)
}} />
</div>
{/* 商品图片 */}
<div className="cart-ci-left" onClick={() => {
this.goto(item.productId)
}}>
<img src={imgUrl + item.productThumbnail} alt={item.productName} />
</div>
{/* 商品信息 */}
<div className="cart-ci-right">
<div className="r-title"><span>{item.productName}</span></div>
<div className="r-step">
<span className="r-price"><span>￥</span>{item.productSalesPrice.toFixed(2)}</span>
<span className="span-stepper">
{/* 加减步进器 */}
<Stepper
style={{ maxWidth: '100px', height: '30px' }}
showNumber
max={item.stockNum}
min={1}
value={item.value}
onChange={(val) => {
if (val > item.stockNum) {
Toast.info("库存不足", 1)
this.props.changeStock(item.id, item.stockNum)
this.editCart(item, val)
} else {
this.props.changeStock(item.id, val)
this.editCart(item, val)
}
}}
/>
</span>
</div>
</div>
</div>
</SwipeAction>
)
}
}
export default connect(
null,
(dispatch) => {
return {
load: bindActionCreators(loadAction, dispatch)
}
}
)(withRouter(CratItem))
\ No newline at end of file
.history/src/components/shopCard/cardItem_20190429094800.js 0 → 100644
import React, { Component } from 'react'
import { connect } from 'react-redux'
import { bindActionCreators } from 'redux'
import * as loadAction from '@actions/loadAction'
import { withRouter } from 'react-router-dom'
import { Checkbox, Stepper, SwipeAction, Toast, Modal } from 'antd-mobile'
import { baseUrl, imgUrl, getToken } from '@common/js/util'
class CratItem extends Component {
// 构造函数
constructor(props) {
super(props)
this.state = {
val: props.item.value
}
}
// 改变选择
onChange(e, id) {
let checked = e.target.checked;
// console.log(checked,id)
this.props.checkChange(id, checked)
}
// 修改购物车
editCart(it, val) {
}
// 删除购物车
delete(id) {
var that = this;
}
//跳转
goto(id) {
}
//render
render() {
let item = this.props.item
return (
<SwipeAction
autoClose={true}
style={{ backgroundColor: '#f5f5f9', paddingBottom: '10px' }}
right={[
{
text: '删除',
onPress: () => {
console.log('delete')
this.delete(item.id)
return false;
},
style: { backgroundColor: '#F4333C', color: 'white' },
},
]}
onOpen={() => console.log('global open')}
onClose={() => {
console.log('global close')
return false;
}}
>
<div className="cart-c-item" >
<div className="cart-c-check">
<Checkbox checked={item.check} onChange={(e) => {
this.onChange(e, item.id)
}} />
</div>
{/* 商品图片 */}
<div className="cart-ci-left" onClick={() => {
this.goto(item.productId)
}}>
<img src={imgUrl + item.productThumbnail} alt={item.productName} />
</div>
{/* 商品信息 */}
<div className="cart-ci-right">
<div className="r-title"><span>{item.productName}</span></div>
<div className="r-step">
<span className="r-price"><span>￥</span>{item.productSalesPrice.toFixed(2)}</span>
<span className="span-stepper">
{/* 加减步进器 */}
<Stepper
style={{ maxWidth: '100px', height: '30px' }}
showNumber
max={item.stockNum}
min={1}
value={item.value}
onChange={(val) => {
if (val > item.stockNum) {
Toast.info("库存不足", 1)
this.props.changeStock(item.id, item.stockNum)
this.editCart(item, val)
} else {
this.props.changeStock(item.id, val)
this.editCart(item, val)
}
}}
/>
</span>
</div>
</div>
</div>
</SwipeAction>
)
}
}
export default connect(
null,
(dispatch) => {
return {
load: bindActionCreators(loadAction, dispatch)
}
}
)(withRouter(CratItem))
\ No newline at end of file
.history/src/components/shopCard/cardItem_20190429094849.js 0 → 100644
import React, { Component } from 'react'
import { connect } from 'react-redux'
import { bindActionCreators } from 'redux'
import * as loadAction from '@actions/loadAction'
import { withRouter } from 'react-router-dom'
import { Checkbox, Stepper, SwipeAction, Toast, Modal } from 'antd-mobile'
import { baseUrl, imgUrl, getToken } from '@common/js/util'
class CratItem extends Component {
// 构造函数
constructor(props) {
super(props)
this.state = {
val: props.item.value
}
}
// 改变选择
onChange(e, id) {
let checked = e.target.checked;
// console.log(checked,id)
this.props.checkChange(id, checked)
}
// 修改购物车
editCart(it, val) {
}
// 删除购物车
delete(id) {
var that = this;
}
//跳转
goto(id) {
}
//render
render() {
let item = this.props.item
return (
<SwipeAction
autoClose={true}
style={{ backgroundColor: '#f5f5f9', paddingBottom: '10px' }}
right={[
{
text: '删除',
onPress: () => {
console.log('delete')
this.delete(item.id)
return false;
},
style: { backgroundColor: '#F4333C', color: 'white' },
},
]}
onOpen={() => console.log('global open')}
onClose={() => {
console.log('global close')
return false;
}}
>
<div className="cart-c-item" >
<div className="cart-c-check">
<Checkbox checked={item.check} onChange={(e) => {
this.onChange(e, item.id)
}} />
</div>
{/* 商品图片 */}
<div className="cart-ci-left" onClick={() => {
this.goto(item.productId)
}}>
{/* <img src={imgUrl + item.productThumbnail} alt={item.productName} /> */}
</div>
{/* 商品信息 */}
<div className="cart-ci-right">
<div className="r-title"><span>{item.productName}</span></div>
<div className="r-step">
<span className="r-price"><span>￥</span>{item.productSalesPrice.toFixed(2)}</span>
<span className="span-stepper">
{/* 加减步进器 */}
<Stepper
style={{ maxWidth: '100px', height: '30px' }}
showNumber
max={item.stockNum}
min={1}
value={item.value}
onChange={(val) => {
if (val > item.stockNum) {
Toast.info("库存不足", 1)
this.props.changeStock(item.id, item.stockNum)
this.editCart(item, val)
} else {
this.props.changeStock(item.id, val)
this.editCart(item, val)
}
}}
/>
</span>
</div>
</div>
</div>
</SwipeAction>
)
}
}
export default connect(
null,
(dispatch) => {
return {
load: bindActionCreators(loadAction, dispatch)
}
}
)(withRouter(CratItem))
\ No newline at end of file
.history/src/components/shopCard/cardItem_20190429094916.js 0 → 100644
import React, { Component } from 'react'
import { connect } from 'react-redux'
import { bindActionCreators } from 'redux'
import * as loadAction from '@actions/loadAction'
import { withRouter } from 'react-router-dom'
import { Checkbox, Stepper, SwipeAction, Toast, Modal } from 'antd-mobile'
class CratItem extends Component {
// 构造函数
constructor(props) {
super(props)
this.state = {
val: props.item.value
}
}
// 改变选择
onChange(e, id) {
let checked = e.target.checked;
// console.log(checked,id)
this.props.checkChange(id, checked)
}
// 修改购物车
editCart(it, val) {
}
// 删除购物车
delete(id) {
var that = this;
}
//跳转
goto(id) {
}
//render
render() {
let item = this.props.item
return (
<SwipeAction
autoClose={true}
style={{ backgroundColor: '#f5f5f9', paddingBottom: '10px' }}
right={[
{
text: '删除',
onPress: () => {
console.log('delete')
this.delete(item.id)
return false;
},
style: { backgroundColor: '#F4333C', color: 'white' },
},
]}
onOpen={() => console.log('global open')}
onClose={() => {
console.log('global close')
return false;
}}
>
<div className="cart-c-item" >
<div className="cart-c-check">
<Checkbox checked={item.check} onChange={(e) => {
this.onChange(e, item.id)
}} />
</div>
{/* 商品图片 */}
<div className="cart-ci-left" onClick={() => {
this.goto(item.productId)
}}>
{/* <img src={imgUrl + item.productThumbnail} alt={item.productName} /> */}
</div>
{/* 商品信息 */}
<div className="cart-ci-right">
<div className="r-title"><span>{item.productName}</span></div>
<div className="r-step">
<span className="r-price"><span>￥</span>{item.productSalesPrice.toFixed(2)}</span>
<span className="span-stepper">
{/* 加减步进器 */}
<Stepper
style={{ maxWidth: '100px', height: '30px' }}
showNumber
max={item.stockNum}
min={1}
value={item.value}
onChange={(val) => {
if (val > item.stockNum) {
Toast.info("库存不足", 1)
this.props.changeStock(item.id, item.stockNum)
this.editCart(item, val)
} else {
this.props.changeStock(item.id, val)
this.editCart(item, val)
}
}}
/>
</span>
</div>
</div>
</div>
</SwipeAction>
)
}
}
export default connect(
null,
(dispatch) => {
return {
load: bindActionCreators(loadAction, dispatch)
}
}
)(withRouter(CratItem))
\ No newline at end of file
.history/src/components/shopCard/cardItem_20190429095728.js 0 → 100644
import React, { Component } from 'react'
import { connect } from 'react-redux'
import { bindActionCreators } from 'redux'
import { withRouter } from 'react-router-dom'
import { Checkbox, Stepper, SwipeAction, Toast, Modal } from 'antd-mobile'
class CratItem extends Component {
// 构造函数
constructor(props) {
super(props)
this.state = {
val: props.item.value
}
}
// 改变选择
onChange(e, id) {
let checked = e.target.checked;
// console.log(checked,id)
this.props.checkChange(id, checked)
}
// 修改购物车
editCart(it, val) {
}
// 删除购物车
delete(id) {
var that = this;
}
//跳转
goto(id) {
}
//render
render() {
let item = this.props.item
return (
<SwipeAction
autoClose={true}
style={{ backgroundColor: '#f5f5f9', paddingBottom: '10px' }}
right={[
{
text: '删除',
onPress: () => {
console.log('delete')
this.delete(item.id)
return false;
},
style: { backgroundColor: '#F4333C', color: 'white' },
},
]}
onOpen={() => console.log('global open')}
onClose={() => {
console.log('global close')
return false;
}}
>
<div className="cart-c-item" >
<div className="cart-c-check">
<Checkbox checked={item.check} onChange={(e) => {
this.onChange(e, item.id)
}} />
</div>
{/* 商品图片 */}
<div className="cart-ci-left" onClick={() => {
this.goto(item.productId)
}}>
{/* <img src={imgUrl + item.productThumbnail} alt={item.productName} /> */}
</div>
{/* 商品信息 */}
<div className="cart-ci-right">
<div className="r-title"><span>{item.productName}</span></div>
<div className="r-step">
<span className="r-price"><span>￥</span>{item.productSalesPrice.toFixed(2)}</span>
<span className="span-stepper">
{/* 加减步进器 */}
<Stepper
style={{ maxWidth: '100px', height: '30px' }}
showNumber
max={item.stockNum}
min={1}
value={item.value}
onChange={(val) => {
if (val > item.stockNum) {
Toast.info("库存不足", 1)
this.props.changeStock(item.id, item.stockNum)
this.editCart(item, val)
} else {
this.props.changeStock(item.id, val)
this.editCart(item, val)
}
}}
/>
</span>
</div>
</div>
</div>
</SwipeAction>
)
}
}
export default connect(
null,
(dispatch) => {
return {
load: bindActionCreators(loadAction, dispatch)
}
}
)(withRouter(CratItem))
\ No newline at end of file
.history/src/components/shopCard/cardItem_20190429100234.js 0 → 100644
import React, { Component } from 'react'
import { Checkbox, Stepper, SwipeAction, Toast, Modal } from 'antd-mobile'
class CardItem extends Component {
// 构造函数
constructor(props) {
super(props)
this.state = {
val: props.item.value
}
}
// 改变选择
onChange(e, id) {
let checked = e.target.checked;
// console.log(checked,id)
this.props.checkChange(id, checked)
}
// 修改购物车
editCart(it, val) {
}
// 删除购物车
delete(id) {
var that = this;
}
//跳转
goto(id) {
}
//render
render() {
let item = this.props.item
return (
<SwipeAction
autoClose={true}
style={{ backgroundColor: '#f5f5f9', paddingBottom: '10px' }}
right={[
{
text: '删除',
onPress: () => {
console.log('delete')
this.delete(item.id)
return false;
},
style: { backgroundColor: '#F4333C', color: 'white' },
},
]}
onOpen={() => console.log('global open')}
onClose={() => {
console.log('global close')
return false;
}}
>
<div className="cart-c-item" >
<div className="cart-c-check">
<Checkbox checked={item.check} onChange={(e) => {
this.onChange(e, item.id)
}} />
</div>
{/* 商品图片 */}
<div className="cart-ci-left" onClick={() => {
this.goto(item.productId)
}}>
{/* <img src={imgUrl + item.productThumbnail} alt={item.productName} /> */}
</div>
{/* 商品信息 */}
<div className="cart-ci-right">
<div className="r-title"><span>{item.productName}</span></div>
<div className="r-step">
<span className="r-price"><span>￥</span>{item.productSalesPrice.toFixed(2)}</span>
<span className="span-stepper">
{/* 加减步进器 */}
<Stepper
style={{ maxWidth: '100px', height: '30px' }}
showNumber
max={item.stockNum}
min={1}
value={item.value}
onChange={(val) => {
if (val > item.stockNum) {
Toast.info("库存不足", 1)
this.props.changeStock(item.id, item.stockNum)
this.editCart(item, val)
} else {
this.props.changeStock(item.id, val)
this.editCart(item, val)
}
}}
/>
</span>
</div>
</div>
</div>
</SwipeAction>
)
}
}
export default CardItem;
\ No newline at end of file
.history/src/components/shopCard/cardItem_20190429102912.js 0 → 100644
import React, { Component } from 'react';
import { Checkbox, Stepper, SwipeAction, Toast, Modal } from 'antd-mobile';
import OrderItem from '@/common/OrderList';
class CardItem extends Component {
// 构造函数
constructor(props) {
super(props)
this.state = {
val: props.item.value
}
}
// 改变选择
onChange(e, id) {
let checked = e.target.checked;
// console.log(checked,id)
this.props.checkChange(id, checked)
}
// 修改购物车
editCart(it, val) {
}
// 删除购物车
delete(id) {
var that = this;
}
//跳转
goto(id) {
}
//render
render() {
let item = this.props.item
return (
<div style={{ "backgroundColor": "#f5f5f5" }}>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
const Tab = (
<div className="shopcard-check">
<Checkbox
checked={item.check}
onChange={(e) => {
// this.onChange(e, item.id)
}}
/>
</div>
)
return (
<OrderItem {...item} key={index} tab={Tab} info={Info}>
</OrderItem>
)
})
}
</div>
)
}
}
export default CardItem;
\ No newline at end of file
.history/src/components/shopCard/cardItem_20190429103017.js 0 → 100644
import React, { Component } from 'react'
import { Checkbox, Stepper, SwipeAction, Toast, Modal } from 'antd-mobile'
class CardItem extends Component {
// 构造函数
constructor(props) {
super(props)
this.state = {
val: props.item.value
}
}
// 改变选择
onChange(e, id) {
let checked = e.target.checked;
// console.log(checked,id)
this.props.checkChange(id, checked)
}
// 修改购物车
editCart(it, val) {
}
// 删除购物车
delete(id) {
var that = this;
}
//跳转
goto(id) {
}
//render
render() {
let item = this.props.item
return (
<SwipeAction
autoClose={true}
style={{ backgroundColor: '#f5f5f9', paddingBottom: '10px' }}
right={[
{
text: '删除',
onPress: () => {
console.log('delete')
this.delete(item.id)
return false;
},
style: { backgroundColor: '#F4333C', color: 'white' },
},
]}
onOpen={() => console.log('global open')}
onClose={() => {
console.log('global close')
return false;
}}
>
<div className="cart-c-item" >
<div className="cart-c-check">
<Checkbox checked={item.check} onChange={(e) => {
this.onChange(e, item.id)
}} />
</div>
{/* 商品图片 */}
<div className="cart-ci-left" onClick={() => {
this.goto(item.productId)
}}>
{/* <img src={imgUrl + item.productThumbnail} alt={item.productName} /> */}
</div>
{/* 商品信息 */}
<div className="cart-ci-right">
<div className="r-title"><span>{item.productName}</span></div>
<div className="r-step">
<span className="r-price"><span>￥</span>{item.productSalesPrice.toFixed(2)}</span>
<span className="span-stepper">
{/* 加减步进器 */}
<Stepper
style={{ maxWidth: '100px', height: '30px' }}
showNumber
max={item.stockNum}
min={1}
value={item.value}
onChange={(val) => {
if (val > item.stockNum) {
Toast.info("库存不足", 1)
this.props.changeStock(item.id, item.stockNum)
this.editCart(item, val)
} else {
this.props.changeStock(item.id, val)
this.editCart(item, val)
}
}}
/>
</span>
</div>
</div>
</div>
</SwipeAction>
)
}
}
export default CardItem;
\ No newline at end of file
.history/src/components/shopCard/cardItem_20190429103143.js 0 → 100644
import React, { Component } from 'react'
import { Checkbox, Stepper, SwipeAction, Toast, Modal } from 'antd-mobile'
class CardItem extends Component {
// 构造函数
constructor(props) {
super(props)
this.state = {
val: props.item.value
}
}
// 改变选择
onChange(e, id) {
let checked = e.target.checked;
// console.log(checked,id)
this.props.checkChange(id, checked)
}
// 修改购物车
editCart(it, val) {
}
// 删除购物车
delete(id) {
var that = this;
}
//跳转
goto(id) {
}
//render
render() {
let item = this.props.item
return (
<SwipeAction
autoClose={true}
style={{ backgroundColor: '#f5f5f9', paddingBottom: '10px' }}
right={[
{
text: '删除',
onPress: () => {
console.log('delete')
this.delete(item.id)
return false;
},
style: { backgroundColor: '#F4333C', color: 'white' },
},
]}
onOpen={() => console.log('global open')}
onClose={() => {
console.log('global close')
return false;
}}
>
<div className="cart-c-item" >
<div className="cart-c-check">
<Checkbox checked={item.check} onChange={(e) => {
this.onChange(e, item.id)
}} />
</div>
{/* 商品图片 */}
<div className="cart-ci-left" onClick={() => {
this.goto(item.productId)
}}>
{/* <img src={imgUrl + item.productThumbnail} alt={item.productName} /> */}
</div>
{/* 商品信息 */}
<div className="cart-ci-right">
<div className="r-title"><span>{item.productName}</span></div>
<div className="r-step">
<span className="r-price"><span>￥</span></span>
<span className="span-stepper">
{/* 加减步进器 */}
<Stepper
style={{ maxWidth: '100px', height: '30px' }}
showNumber
max={item.stockNum}
min={1}
value={item.value}
onChange={(val) => {
if (val > item.stockNum) {
Toast.info("库存不足", 1)
this.props.changeStock(item.id, item.stockNum)
this.editCart(item, val)
} else {
this.props.changeStock(item.id, val)
this.editCart(item, val)
}
}}
/>
</span>
</div>
</div>
</div>
</SwipeAction>
)
}
}
export default CardItem;
\ No newline at end of file
.history/src/components/shopCard/cardItem_20190429105553.js 0 → 100644
import React, { Component } from 'react'
import { Checkbox, Stepper, SwipeAction, Toast, Modal } from 'antd-mobile'
class CardItem extends Component {
// 构造函数
constructor(props) {
super(props)
this.state = {
val: props.item.value
}
}
// 改变选择
onChange(e, id) {
let checked = e.target.checked;
// console.log(checked,id)
this.props.checkChange(id, checked)
}
// 修改购物车
editCart(it, val) {
}
// 删除购物车
delete(id) {
var that = this;
}
//跳转
goto(id) {
}
//render
render() {
let item = this.props.item
return (
<SwipeAction
autoClose={true}
style={{ backgroundColor: '#f5f5f9', paddingBottom: '10px' }}
right={[
{
text: '删除',
onPress: () => {
console.log('delete')
this.delete(item.id)
return false;
},
style: { backgroundColor: '#F4333C', color: 'white' },
},
]}
onOpen={() => console.log('global open')}
onClose={() => {
console.log('global close')
return false;
}}
>
<div className="cart-c-item" >
<div className="cart-c-check">
<Checkbox checked={item.check} onChange={(e) => {
this.onChange(e, item.id)
}} />
</div>
{/* 商品图片 */}
<div className="cart-ci-left" onClick={() => {
this.goto(item.productId)
}}>
{/* <img src={imgUrl + item.productThumbnail} alt={item.productName} /> */}
</div>
{/* 商品信息 */}
<div className="cart-ci-right">
<div className="r-title"><span>{item.productName}</span></div>
<div className="r-step">
<span className="r-price"><span>￥</span></span>
<span className="span-stepper">
{/* 加减步进器 */}
<Stepper
style={{ maxWidth: '100px', height: '30px' }}
showNumber
max={item.stockNum}
min={1}
value={item.value}
onChange={(val) => {
console.log(val);
}}
/>
</span>
</div>
</div>
</div>
</SwipeAction>
)
}
}
export default CardItem;
\ No newline at end of file
.history/src/components/shopCard/cardItem_20190429115753.js 0 → 100644
import React, { Component } from 'react'
import { Checkbox, Stepper, SwipeAction, Toast, Modal } from 'antd-mobile'
class CardItem extends Component {
// 构造函数
constructor(props) {
super(props)
this.state = {
val: props.item.value
}
}
// 改变选择
onChange(e, id) {
let checked = e.target.checked;
// console.log(checked,id)
this.props.checkChange(id, checked)
}
// 修改购物车
editCart(it, val) {
}
// 删除购物车
delete(id) {
var that = this;
}
//跳转
goto(id) {
}
//render
render() {
let item = this.props.item
return (
<SwipeAction
autoClose={true}
style={{ backgroundColor: '#f5f5f9', paddingBottom: '10px' }}
right={[
{
text: '删除',
onPress: () => {
console.log('delete')
this.delete(item.id)
return false;
},
style: { backgroundColor: '#F4333C', color: 'white' },
},
]}
onOpen={() => console.log('global open')}
onClose={() => {
console.log('global close')
return false;
}}
>
<div className="cart-c-item" >
<div className="cart-c-check">
<Checkbox checked={item.check} onChange={(e) => {
this.onChange(e, item.id)
}} />
</div>
{/* 商品图片 */}
<div className="cart-ci-left" onClick={() => {
this.goto(item.productId)
}}>
{/* <img src={imgUrl + item.productThumbnail} alt={item.productName} /> */}
</div>
{/* 商品信息 */}
<div className="cart-ci-right">
<div className="r-title"><span>{item.productName}</span></div>
<div className="r-step">
<span className="r-price"><span>￥</span></span>
</div>
</div>
</div>
</SwipeAction>
)
}
}
export default CardItem;
\ No newline at end of file
.history/src/components/shopCard/cardItem_20190429115808.js 0 → 100644
import React, { Component } from 'react'
import { Checkbox, Stepper, SwipeAction, Toast, Modal } from 'antd-mobile'
class CardItem extends Component {
// 构造函数
constructor(props) {
super(props)
this.state = {
val: props.item.value
}
}
// 改变选择
onChange(e, id) {
let checked = e.target.checked;
// console.log(checked,id)
this.props.checkChange(id, checked)
}
// 修改购物车
editCart(it, val) {
}
// 删除购物车
delete(id) {
var that = this;
}
//跳转
goto(id) {
}
//render
render() {
let item = this.props.item
return (
<SwipeAction
autoClose={true}
style={{ backgroundColor: '#f5f5f9', paddingBottom: '10px' }}
right={[
{
text: '删除',
onPress: () => {
console.log('delete')
this.delete(item.id)
return false;
},
style: { backgroundColor: '#F4333C', color: 'white' },
},
]}
onOpen={() => console.log('global open')}
onClose={() => {
console.log('global close')
return false;
}}
>
<div className="cart-c-item" >
<div className="cart-c-check">
<Checkbox checked={item.check} onChange={(e) => {
this.onChange(e, item.id)
}} />
</div>
{/* 商品图片 */}
<div className="cart-ci-left" onClick={() => {
this.goto(item.productId)
}}>
{/* <img src={imgUrl + item.productThumbnail} alt={item.productName} /> */}
</div>
{/* 商品信息 */}
<div className="cart-ci-right">
</div>
</div>
</SwipeAction>
)
}
}
export default CardItem;
\ No newline at end of file
.history/src/components/shopCard/cardItem_20190429120811.js 0 → 100644
import React, { Component } from 'react'
import { Checkbox, Stepper, SwipeAction, Toast, Modal } from 'antd-mobile'
class CardItem extends Component {
// 构造函数
constructor(props) {
super(props)
this.state = {
val: props.item.value
}
}
// 改变选择
onChange(e, id) {
let checked = e.target.checked;
// console.log(checked,id)
this.props.checkChange(id, checked)
}
// 修改购物车
editCart(it, val) {
}
// 删除购物车
delete(id) {
var that = this;
}
//跳转
goto(id) {
}
//render
render() {
let item = this.props.item
return (
<div className="cart-c-item" >
<div className="cart-c-check">
<Checkbox checked={item.check} onChange={(e) => {
this.onChange(e, item.id)
}} />
</div>
{/* 商品图片 */}
<div className="cart-ci-left" onClick={() => {
this.goto(item.productId)
}}>
{/* <img src={imgUrl + item.productThumbnail} alt={item.productName} /> */}
</div>
{/* 商品信息 */}
<div className="cart-ci-right">
</div>
</div>
)
}
}
export default CardItem;
\ No newline at end of file
.history/src/components/shopCard/cardItem_20190429141919.js 0 → 100644
import React, { Component } from 'react';
import { Checkbox, Stepper, SwipeAction, Toast, Modal } from 'antd-mobile';
import OrderList from '@/common/OrderList';
class CardItem extends Component {
// 构造函数
constructor(props) {
super(props)
this.state = {
val: props.item.value
}
}
// 改变选择
onChange(e, id) {
let checked = e.target.checked;
// console.log(checked,id)
this.props.checkChange(id, checked)
}
// 修改购物车
editCart(it, val) {
}
// 删除购物车
delete(id) {
var that = this;
}
//跳转
goto(id) {
}
//render
render() {
let item = this.props.item
return (
<div className="cart-c-item" >
<div className="cart-c-check">
<Checkbox checked={item.check} onChange={(e) => {
this.onChange(e, item.id)
}} />
</div>
<OrderList></OrderList>
{/* 商品图片 */}
<div className="cart-ci-left" onClick={() => {
this.goto(item.productId)
}}>
{/* <img src={imgUrl + item.productThumbnail} alt={item.productName} /> */}
</div>
{/* 商品信息 */}
<div className="cart-ci-right">
</div>
</div>
)
}
}
export default CardItem;
\ No newline at end of file
.history/src/components/shopCard/cardItem_20190429141949.js 0 → 100644
import React, { Component } from 'react';
import { Checkbox, Stepper, SwipeAction, Toast, Modal } from 'antd-mobile';
import OrderList from '@/common/OrderList';
class CardItem extends Component {
// 构造函数
constructor(props) {
super(props)
this.state = {
val: props.item.value
}
}
// 改变选择
onChange(e, id) {
let checked = e.target.checked;
// console.log(checked,id)
this.props.checkChange(id, checked)
}
// 修改购物车
editCart(it, val) {
}
// 删除购物车
delete(id) {
var that = this;
}
//跳转
goto(id) {
}
//render
render() {
let item = this.props.item
return (
<div className="cart-c-item" >
<div className="cart-c-check">
<Checkbox checked={item.check} onChange={(e) => {
this.onChange(e, item.id)
}} />
</div>
{/* 商品图片 */}
<div className="cart-ci-left" onClick={() => {
this.goto(item.productId)
}}>
{/* <img src={imgUrl + item.productThumbnail} alt={item.productName} /> */}
<OrderList></OrderList>
</div>
{/* 商品信息 */}
<div className="cart-ci-right">
</div>
</div>
)
}
}
export default CardItem;
\ No newline at end of file
.history/src/components/shopCard/cardItem_20190429142156.js 0 → 100644
import React, { Component } from 'react';
import { Checkbox, Stepper, SwipeAction, Toast, Modal } from 'antd-mobile';
class CardItem extends Component {
// 构造函数
constructor(props) {
super(props)
this.state = {
val: props.item.value
}
}
// 改变选择
onChange(e, id) {
let checked = e.target.checked;
// console.log(checked,id)
this.props.checkChange(id, checked)
}
// 修改购物车
editCart(it, val) {
}
// 删除购物车
delete(id) {
var that = this;
}
//跳转
goto(id) {
}
//render
render() {
let item = this.props.item
return (
<div className="cart-c-item" >
<div className="cart-c-check">
<Checkbox checked={item.check} onChange={(e) => {
this.onChange(e, item.id)
}} />
</div>
{/* 商品图片 */}
<div className="cart-ci-left" onClick={() => {
this.goto(item.productId)
}}>
<img src={imgUrl + item.productThumbnail} alt={item.productName} />
</div>
{/* 商品信息 */}
<div className="cart-ci-right">
</div>
</div>
)
}
}
export default CardItem;
\ No newline at end of file
.history/src/components/shopCard/cardItem_20190429142202.js 0 → 100644
import React, { Component } from 'react';
import { Checkbox, Stepper, SwipeAction, Toast, Modal } from 'antd-mobile';
class CardItem extends Component {
// 构造函数
constructor(props) {
super(props)
this.state = {
val: props.item.value
}
}
// 改变选择
onChange(e, id) {
let checked = e.target.checked;
// console.log(checked,id)
this.props.checkChange(id, checked)
}
// 修改购物车
editCart(it, val) {
}
// 删除购物车
delete(id) {
var that = this;
}
//跳转
goto(id) {
}
//render
render() {
let item = this.props.item
return (
<div className="cart-c-item" >
<div className="cart-c-check">
<Checkbox checked={item.check} onChange={(e) => {
this.onChange(e, item.id)
}} />
</div>
{/* 商品图片 */}
<div className="cart-ci-left" onClick={() => {
this.goto(item.productId)
}}>
</div>
{/* 商品信息 */}
<div className="cart-ci-right">
</div>
</div>
)
}
}
export default CardItem;
\ No newline at end of file
.history/src/components/shopCard/cardItem_20190429142256.js 0 → 100644
import React, { Component } from 'react';
import { Checkbox, Stepper, SwipeAction, Toast, Modal } from 'antd-mobile';
import OrderList from '@/common/OrderList';
class CardItem extends Component {
// 构造函数
constructor(props) {
super(props)
this.state = {
val: props.item.value
}
}
// 改变选择
onChange(e, id) {
let checked = e.target.checked;
// console.log(checked,id)
this.props.checkChange(id, checked)
}
// 修改购物车
editCart(it, val) {
}
// 删除购物车
delete(id) {
var that = this;
}
//跳转
goto(id) {
}
//render
render() {
let item = this.props.item
return (
<div className="cart-c-item" >
<div className="cart-c-check">
<Checkbox checked={item.check} onChange={(e) => {
this.onChange(e, item.id)
}} />
</div>
{/* 商品图片 */}
<div className="cart-ci-left" onClick={() => {
this.goto(item.productId)
}}>
{/* <img src={imgUrl + item.productThumbnail} alt={item.productName} /> */}
<OrderList>
</OrderList>
</div>
{/* 商品信息 */}
<div className="cart-ci-right">
</div>
</div>
)
}
}
export default CardItem;
\ No newline at end of file
.history/src/components/shopCard/cardItem_20190429142523.js 0 → 100644
import React, { Component } from 'react';
import { Checkbox } from 'antd-mobile';
import OrderList from '@/common/OrderList';
class CardItem extends Component {
// 构造函数
constructor(props) {
super(props)
this.state = {
val: props.item.value
}
}
// 改变选择
onChange(e, id) {
let checked = e.target.checked;
// console.log(checked,id)
this.props.checkChange(id, checked)
}
// 修改购物车
editCart(it, val) {
}
// 删除购物车
delete(id) {
var that = this;
}
//跳转
goto(id) {
}
//render
render() {
let item = this.props.item
return (
<div className="cart-c-item" >
<div className="cart-c-check">
<Checkbox checked={item.check} onChange={(e) => {
this.onChange(e, item.id)
}} />
</div>
{/* 商品图片 */}
<div className="cart-ci-left" onClick={() => {
this.goto(item.productId)
}}>
{/* <img src={imgUrl + item.productThumbnail} alt={item.productName} /> */}
<OrderList>
</OrderList>
</div>
{/* 商品信息 */}
<div className="cart-ci-right">
</div>
</div>
)
}
}
export default CardItem;
\ No newline at end of file
.history/src/components/shopCard/cardItem_20190429142532.js 0 → 100644
import React, { Component } from 'react';
import { Checkbox } from 'antd-mobile';
import OrderList from '@/common/OrderList';
class CardItem extends Component {
// 构造函数
constructor(props) {
super(props)
this.state = {
val: props.item.value
}
}
// 改变选择
onChange(e, id) {
let checked = e.target.checked;
// console.log(checked,id)
this.props.checkChange(id, checked)
}
// 修改购物车
editCart(it, val) {
}
// 删除购物车
delete(id) {
}
//跳转
goto(id) {
}
//render
render() {
let item = this.props.item
return (
<div className="cart-c-item" >
<div className="cart-c-check">
<Checkbox checked={item.check} onChange={(e) => {
this.onChange(e, item.id)
}} />
</div>
{/* 商品图片 */}
<div className="cart-ci-left" onClick={() => {
this.goto(item.productId)
}}>
{/* <img src={imgUrl + item.productThumbnail} alt={item.productName} /> */}
<OrderList>
</OrderList>
</div>
{/* 商品信息 */}
<div className="cart-ci-right">
</div>
</div>
)
}
}
export default CardItem;
\ No newline at end of file
.history/src/components/shopCard/cardItem_20190429142949.js 0 → 100644
import React, { Component } from 'react';
import { Checkbox } from 'antd-mobile';
import OrderList from '@/common/OrderList';
class CardItem extends Component {
// 构造函数
constructor(props) {
super(props)
this.state = {
val: props.item.value
}
}
// 改变选择
onChange(e, id) {
let checked = e.target.checked;
// console.log(checked,id)
this.props.checkChange(id, checked)
}
// 修改购物车
editCart(it, val) {
}
// 删除购物车
delete(id) {
}
//跳转
goto(id) {
}
//render
render() {
let item = this.props.item
return (
<div className="cart-c-item" >
<div className="cart-c-check">
<Checkbox checked={item.check} onChange={(e) => {
this.onChange(e, item.id)
}} />
</div>
{/* 商品图片 */}
<div className="cart-ci-left" >
<OrderList>
</OrderList>
</div>
{/* 商品信息 */}
<div className="cart-ci-right">
</div>
</div>
)
}
}
export default CardItem;
\ No newline at end of file
.history/src/components/shopCard/cardItem_20190429143140.js 0 → 100644
import React, { Component } from 'react';
import { Checkbox } from 'antd-mobile';
import OrderList from '@/common/OrderList';
class CardItem extends Component {
// 构造函数
constructor(props) {
super(props)
this.state = {
val: props.item.value
}
}
// 改变选择
onChange(e, id) {
let checked = e.target.checked;
// console.log(checked,id)
this.props.checkChange(id, checked)
}
// 修改购物车
editCart(it, val) {
}
// 删除购物车
delete(id) {
}
//跳转
goto(id) {
}
//render
render() {
let item = this.props.item
return (
<div className="cart-c-item" >
<div className="cart-c-check">
<Checkbox checked={item.check} onChange={(e) => {
this.onChange(e, item.id)
}} />
</div>
<OrderList>
</OrderList>
</div>
)
}
}
export default CardItem;
\ No newline at end of file
.history/src/components/shopCard/cardItem_20190429143408.js 0 → 100644
import React, { Component } from 'react';
import { Checkbox } from 'antd-mobile';
import OrderList from '@/common/OrderList';
class CardItem extends Component {
// 构造函数
constructor(props) {
super(props)
this.state = {
val: props.item.value
}
}
// 改变选择
onChange(e, id) {
let checked = e.target.checked;
// console.log(checked,id)
this.props.checkChange(id, checked)
}
// 修改购物车
editCart(it, val) {
}
// 删除购物车
delete(id) {
}
//跳转
goto(id) {
}
//render
render() {
let item = this.props.item
return (
<div className="cart-c-item" >
<div className="cart-c-check">
<Checkbox checked={item.check} onChange={(e) => {
this.onChange(e, item.id)
}} />
</div>
<div className="card-wrap">
<OrderList></OrderList>
</div>
</div>
)
}
}
export default CardItem;
\ No newline at end of file
.history/src/components/shopCard/cardItem_20190429143426.js 0 → 100644
import React, { Component } from 'react';
import { Checkbox } from 'antd-mobile';
import OrderList from '@/common/OrderList';
class CardItem extends Component {
// 构造函数
constructor(props) {
super(props)
this.state = {
val: props.item.value
}
}
// 改变选择
onChange(e, id) {
let checked = e.target.checked;
// console.log(checked,id)
this.props.checkChange(id, checked)
}
// 修改购物车
editCart(it, val) {
}
// 删除购物车
delete(id) {
}
//跳转
goto(id) {
}
//render
render() {
let item = this.props.item
return (
<div className="cart-c-item" >
<div className="cart-c-check">
<Checkbox checked={item.check} onChange={(e) => {
this.onChange(e, item.id)
}} />
</div>
<div className="card-wrap">
<OrderList></OrderList>
</div>
</div>
)
}
}
export default CardItem;
\ No newline at end of file
.history/src/components/shopCard/cardItem_20190429144900.js 0 → 100644
import React, { Component } from 'react';
import { Checkbox } from 'antd-mobile';
import OrderList from '@/common/OrderList';
class CardItem extends Component {
// 构造函数
constructor(props) {
super(props)
this.state = {
val: props.item.value
}
}
// 改变选择
onChange(e, id) {
let checked = e.target.checked;
// console.log(checked,id)
this.props.checkChange(id, checked)
}
// 修改购物车
editCart(it, val) {
}
// 删除购物车
delete(id) {
}
//跳转
goto(id) {
}
//render
render() {
let item = this.props.item
return (
<div className="cart-c-item" >
<div className="cart-c-check">
<Checkbox checked={item.check} onChange={(e) => {
this.onChange(e, item.id)
}} />
</div>
<div className="card-wrap">
const Info = (
<div className="info">
<p className='title'>{item.title}</p>
<p className='contact'>{item.contact}</p>
<p className='des'>
<span className='time'>{item.time}</span>
<span className='record'>{item.record}</span>
</p>
</div>
)
<OrderList info={Info}></OrderList>
</div>
</div>
)
}
}
export default CardItem;
\ No newline at end of file
.history/src/components/shopCard/cardItem_20190429144932.js 0 → 100644
import React, { Component } from 'react';
import { Checkbox } from 'antd-mobile';
import OrderList from '@/common/OrderList';
class CardItem extends Component {
// 构造函数
constructor(props) {
super(props)
this.state = {
val: props.item.value
}
}
// 改变选择
onChange(e, id) {
let checked = e.target.checked;
// console.log(checked,id)
this.props.checkChange(id, checked)
}
// 修改购物车
editCart(it, val) {
}
// 删除购物车
delete(id) {
}
//跳转
goto(id) {
}
//render
render() {
let item = this.props.item
return (
<div className="cart-c-item" >
<div className="cart-c-check">
<Checkbox checked={item.check} onChange={(e) => {
this.onChange(e, item.id)
}} />
</div>
<div className="card-wrap">
const Info = (
<div className="info">
<p className='title'>{item.title}</p>
<p className='contact'>{item.contact}</p>
<p className='des'>
<span className='time'>{item.time}</span>
<span className='record'>{item.record}</span>
</p>
</div>
)
<OrderList info={Info}></OrderList>
</div>
</div>
)
}
}
export default CardItem;
\ No newline at end of file
.history/src/components/shopCard/cardItem_20190429144956.js 0 → 100644
import React, { Component } from 'react';
import { Checkbox } from 'antd-mobile';
import OrderList from '@/common/OrderList';
class CardItem extends Component {
// 构造函数
constructor(props) {
super(props)
this.state = {
val: props.item.value
}
}
// 改变选择
onChange(e, id) {
let checked = e.target.checked;
// console.log(checked,id)
this.props.checkChange(id, checked)
}
// 修改购物车
editCart(it, val) {
}
// 删除购物车
delete(id) {
}
//跳转
goto(id) {
}
//render
render() {
let item = this.props.item
const Info = (
<div className="info">
<p className='title'>{item.title}</p>
<p className='contact'>{item.contact}</p>
<p className='des'>
<span className='time'>{item.time}</span>
<span className='record'>{item.record}</span>
</p>
</div>
)
return (
<div className="cart-c-item" >
<div className="cart-c-check">
<Checkbox checked={item.check} onChange={(e) => {
this.onChange(e, item.id)
}} />
</div>
<div className="card-wrap">
<OrderList info={Info}></OrderList>
</div>
</div>
)
}
}
export default CardItem;
\ No newline at end of file
.history/src/components/shopCard/cardItem_20190429145208.js 0 → 100644
import React, { Component } from 'react';
import { Checkbox } from 'antd-mobile';
import OrderList from '@/common/OrderList';
class CardItem extends Component {
// 构造函数
constructor(props) {
super(props)
this.state = {
val: props.item.value
}
}
// 改变选择
onChange(e, id) {
let checked = e.target.checked;
// console.log(checked,id)
this.props.checkChange(id, checked)
}
// 修改购物车
editCart(it, val) {
}
// 删除购物车
delete(id) {
}
//跳转
goto(id) {
}
//render
render() {
let item = this.props.item
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
return (
<div className="cart-c-item" >
<div className="cart-c-check">
<Checkbox checked={item.check} onChange={(e) => {
this.onChange(e, item.id)
}} />
</div>
<div className="card-wrap">
<OrderList info={Info}></OrderList>
</div>
</div>
)
}
}
export default CardItem;
\ No newline at end of file
.history/src/components/shopCard/cardList_20190429094141.js 0 → 100644
import React, { Component } from 'react'
import CartItem from '@components/Cart/CartItem'
class CratList extends Component {
render() {
return (
<div className="cart-main">
{/* 遍历购物车商品列表 */}
<div className="cart-c-body">
{
this.props.data.length > 0 ?
this.props.data.map((item, i) => {
return (
<CartItem index={i} changeStock={(id, val) => {
this.props.changeStock(id, val)
}} checkChange={(id, val) => {
this.props.checkChange(id, val)
}} getCartList={() => {
this.props.getCartList()
}} key={i} item={item}></CartItem>
)
})
: <div className="cart-tip">暂无商品</div>
}
</div>
</div>
)
}
}
export default CratList
\ No newline at end of file
.history/src/components/shopCard/cardList_20190429095825.js 0 → 100644
import React, { Component } from 'react'
import CartItem from '@components/Cart/CartItem'
class CradList extends Component {
render() {
return (
<div className="cart-main">
{/* 遍历购物车商品列表 */}
<div className="cart-c-body">
{
this.props.data.length > 0 ?
this.props.data.map((item, i) => {
return (
<CartItem index={i} changeStock={(id, val) => {
this.props.changeStock(id, val)
}} checkChange={(id, val) => {
this.props.checkChange(id, val)
}} getCartList={() => {
this.props.getCartList()
}} key={i} item={item}></CartItem>
)
})
: <div className="cart-tip">暂无商品</div>
}
</div>
</div>
)
}
}
export default CradList
\ No newline at end of file
.history/src/components/shopCard/cardList_20190429095827.js 0 → 100644
import React, { Component } from 'react'
import CartItem from '@components/Cart/CartItem'
class CradList extends Component {
render() {
return (
<div className="cart-main">
{/* 遍历购物车商品列表 */}
<div className="cart-c-body">
{
this.props.data.length > 0 ?
this.props.data.map((item, i) => {
return (
<CartItem index={i} changeStock={(id, val) => {
this.props.changeStock(id, val)
}} checkChange={(id, val) => {
this.props.checkChange(id, val)
}} getCartList={() => {
this.props.getCartList()
}} key={i} item={item}></CartItem>
)
})
: <div className="cart-tip">暂无商品</div>
}
</div>
</div>
)
}
}
export default CradList;
\ No newline at end of file
.history/src/components/shopCard/cardList_20190429095939.js 0 → 100644
import React, { Component } from 'react'
import CartItem from './cardItem'
class CradList extends Component {
render() {
return (
<div className="cart-main">
{/* 遍历购物车商品列表 */}
<div className="cart-c-body">
{
this.props.data.length > 0 ?
this.props.data.map((item, i) => {
return (
<CartItem index={i} changeStock={(id, val) => {
this.props.changeStock(id, val)
}} checkChange={(id, val) => {
this.props.checkChange(id, val)
}} getCartList={() => {
this.props.getCartList()
}} key={i} item={item}></CartItem>
)
})
: <div className="cart-tip">暂无商品</div>
}
</div>
</div>
)
}
}
export default CradList;
\ No newline at end of file
.history/src/components/shopCard/cardList_20190429095958.js 0 → 100644
import React, { Component } from 'react'
import CartItem from './cardItem'
class CradList extends Component {
render() {
return (
<div className="cart-main">
{/* 遍历购物车商品列表 */}
<div className="cart-c-body">
{
this.props.data.length > 0 ?
this.props.data.map((item, i) => {
return (
<CartItem index={i} changeStock={(id, val) => {
this.props.changeStock(id, val)
}} checkChange={(id, val) => {
this.props.checkChange(id, val)
}} getCartList={() => {
this.props.getCartList()
}} key={i} item={item}></CartItem>
)
})
: <div className="cart-tip">暂无商品</div>
}
</div>
</div>
)
}
}
export default CradList;
\ No newline at end of file
.history/src/components/shopCard/cardList_20190429100014.js 0 → 100644
import React, { Component } from 'react'
import CartItem from './cardItem'
class CardList extends Component {
render() {
return (
<div className="cart-main">
{/* 遍历购物车商品列表 */}
<div className="cart-c-body">
{
this.props.data.length > 0 ?
this.props.data.map((item, i) => {
return (
<CartItem index={i} changeStock={(id, val) => {
this.props.changeStock(id, val)
}} checkChange={(id, val) => {
this.props.checkChange(id, val)
}} getCartList={() => {
this.props.getCartList()
}} key={i} item={item}></CartItem>
)
})
: <div className="cart-tip">暂无商品</div>
}
</div>
</div>
)
}
}
export default CardList;
\ No newline at end of file
.history/src/components/shopCard/cardList_20190429100133.js 0 → 100644
import React, { Component } from 'react'
import CartItem from './cardItem'
class CardList extends Component {
render() {
return (
<div className="cart-main">
{/* 遍历购物车商品列表 */}
<div className="cart-c-body">
{
this.props.data.length > 0 ?
this.props.data.map((item, i) => {
return (
<CartItem
index={i} changeStock={(id, val) => {
this.props.changeStock(id, val)
}}
checkChange={(id, val) => {
this.props.checkChange(id, val)
}}
getCartList={() => {
this.props.getCartList()
}} key={i} item={item}></CartItem>
)
})
: <div className="cart-tip">暂无商品</div>
}
</div>
</div>
)
}
}
export default CardList;
\ No newline at end of file
.history/src/components/shopCard/cardList_20190429100305.js 0 → 100644
import React, { Component } from 'react'
import CardItem from './cardItem'
class CardList extends Component {
render() {
return (
<div className="cart-main">
{/* 遍历购物车商品列表 */}
<div className="cart-c-body">
{
this.props.data.length > 0 ?
this.props.data.map((item, i) => {
return (
<CartItem
index={i} changeStock={(id, val) => {
this.props.changeStock(id, val)
}}
checkChange={(id, val) => {
this.props.checkChange(id, val)
}}
getCartList={() => {
this.props.getCartList()
}} key={i} item={item}></CartItem>
)
})
: <div className="cart-tip">暂无商品</div>
}
</div>
</div>
)
}
}
export default CardList;
\ No newline at end of file
.history/src/components/shopCard/cardList_20190429100310.js 0 → 100644
import React, { Component } from 'react'
import CardItem from './cardItem'
class CardList extends Component {
render() {
return (
<div className="cart-main">
{/* 遍历购物车商品列表 */}
<div className="cart-c-body">
{
this.props.data.length > 0 ?
this.props.data.map((item, i) => {
return (
<CardItem
index={i} changeStock={(id, val) => {
this.props.changeStock(id, val)
}}
checkChange={(id, val) => {
this.props.checkChange(id, val)
}}
getCartList={() => {
this.props.getCartList()
}} key={i} item={item}></CardItem>
)
})
: <div className="cart-tip">暂无商品</div>
}
</div>
</div>
)
}
}
export default CardList;
\ No newline at end of file
.history/src/components/shopCard/cardList_20190429100729.js 0 → 100644
import React, { Component } from 'react'
import CardItem from './cardItem'
class CardList extends Component {
render() {
return (
<div className="cart-main">
{/* 遍历购物车商品列表 */}
<div className="cart-c-body">
{
this.props.data.length > 0 ?
this.props.data.map((item, i) => {
return (
<CardItem
index={i} changeStock={(id, val) => {
this.props.changeStock(id, val)
}}
checkChange={(id, val) => {
this.props.checkChange(id, val)
}}
getCartList={() => {
this.props.getCartList()
}} key={i} item={item}></CardItem>
)
})
: <div className="cart-tip">暂无商品</div>
}
</div>
</div>
)
}
}
export default CardList;
\ No newline at end of file
.history/src/components/shopCard/cardList_20190429101126.js 0 → 100644
import React, { Component } from 'react'
import CardItem from './cardItem'
class CardList extends Component {
render() {
return (
<div className="cart-main">
{/* 遍历购物车商品列表 */}
<div className="cart-c-body">
{
this.props.data.length > 0 ?
this.props.data.map((item, i) => {
return (
<CardItem
index={i} changeStock={(id, val) => {
this.props.changeStock(id, val)
}}
checkChange={(id, val) => {
this.props.checkChange(id, val)
}}
getCartList={() => {
this.props.getCartList()
}} key={i} item={item}></CardItem>
)
})
: <div className="cart-tip">暂无商品</div>
}
</div>
</div>
)
}
}
export default CardList;
\ No newline at end of file
.history/src/components/shopCard/cardList_20190429101235.js 0 → 100644
import React, { Component } from 'react';
import { connect } from 'react-redux';
import CardItem from './cardItem'
class CardList extends Component {
render() {
return (
<div className="cart-main">
{/* 遍历购物车商品列表 */}
<div className="cart-c-body">
{
this.props.data.length > 0 ?
this.props.data.map((item, i) => {
return (
<CardItem
index={i} changeStock={(id, val) => {
this.props.changeStock(id, val)
}}
checkChange={(id, val) => {
this.props.checkChange(id, val)
}}
getCartList={() => {
this.props.getCartList()
}} key={i} item={item}></CardItem>
)
})
: <div className="cart-tip">暂无商品</div>
}
</div>
</div>
)
}
}
export default connect()(CardList);
\ No newline at end of file
.history/src/components/shopCard/cardList_20190429101253.js 0 → 100644
import React, { Component } from 'react'
import CardItem from './cardItem'
class CardList extends Component {
render() {
return (
<div className="cart-main">
{/* 遍历购物车商品列表 */}
<div className="cart-c-body">
{
this.props.data.length > 0 ?
this.props.data.map((item, i) => {
return (
<CardItem
index={i} changeStock={(id, val) => {
this.props.changeStock(id, val)
}}
checkChange={(id, val) => {
this.props.checkChange(id, val)
}}
getCartList={() => {
this.props.getCartList()
}} key={i} item={item}></CardItem>
)
})
: <div className="cart-tip">暂无商品</div>
}
</div>
</div>
)
}
}
export default CardList;
\ No newline at end of file
.history/src/components/shopCard/cardList_20190429101317.js 0 → 100644
import React, { Component } from 'react'
import CardItem from './cardItem'
class ShopCard extends Component {
render() {
return (
<div className="cart-main">
{/* 遍历购物车商品列表 */}
<div className="cart-c-body">
{
this.props.data.length > 0 ?
this.props.data.map((item, i) => {
return (
<CardItem
index={i} changeStock={(id, val) => {
this.props.changeStock(id, val)
}}
checkChange={(id, val) => {
this.props.checkChange(id, val)
}}
getCartList={() => {
this.props.getCartList()
}} key={i} item={item}></CardItem>
)
})
: <div className="cart-tip">暂无商品</div>
}
</div>
</div>
)
}
}
export default ShopCard;
\ No newline at end of file
.history/src/components/shopCard/cardList_20190429101847.js 0 → 100644
import React, { Component } from 'react'
import CardItem from './cardItem'
class ShopCard extends Component {
render() {
return (
<div className="cart-main">
{/* 遍历购物车商品列表 */}
<div className="cart-c-body">
{/* {
this.props.data.length > 0 ?
this.props.data.map((item, i) => {
return (
<CardItem
index={i} changeStock={(id, val) => {
this.props.changeStock(id, val)
}}
checkChange={(id, val) => {
this.props.checkChange(id, val)
}}
getCartList={() => {
this.props.getCartList()
}} key={i} item={item}></CardItem>
)
})
: <div className="cart-tip">暂无商品</div>
} */}
</div>
</div>
)
}
}
export default ShopCard;
\ No newline at end of file
.history/src/components/shopCard/cardList_20190429102331.js 0 → 100644
import React, { Component } from 'react'
import CardItem from './cardItem'
class ShopCard extends Component {
render() {
return (
<div className="cart-main">
{/* 遍历购物车商品列表 */}
<div className="cart-c-body">
{
this.props.data.length > 0 ?
this.props.data.map((item, i) => {
return (
<CardItem
index={i} changeStock={(id, val) => {
this.props.changeStock(id, val)
}}
checkChange={(id, val) => {
this.props.checkChange(id, val)
}}
getCartList={() => {
this.props.getCartList()
}} key={i} item={item}></CardItem>
)
})
: <div className="cart-tip">暂无商品</div>
}
</div>
</div>
)
}
}
export default ShopCard;
\ No newline at end of file
.history/src/components/shopCard/cardList_20190429103128.js 0 → 100644
import React, { Component } from 'react'
import CardItem from './cardItem'
class ShopCard extends Component {
render() {
return (
<div className="cart-main">
{/* 遍历购物车商品列表 */}
<div className="cart-c-body">
{
this.props.data.length > 0 ?
this.props.data.map((item, i) => {
return (
<CardItem
index={i}
changeStock={(id, val) => {
this.props.changeStock(id, val)
}}
checkChange={(id, val) => {
this.props.checkChange(id, val)
}}
getCartList={() => {
this.props.getCartList()
}} key={i} item={item}></CardItem>
)
})
: <div className="cart-tip">暂无商品</div>
}
</div>
</div>
)
}
}
export default ShopCard;
\ No newline at end of file
.history/src/components/shopCard/card_20190429143407.scss 0 → 100644
.cart-page{
height: 100%;
width: 100%;
display: flex;
flex-direction: column;
.cart-tip{
display: flex;
align-items:center;
justify-content: center;
min-height: 60px;
color:#555;
}
.edit{
padding-right:10px;
font-size:14px;
}
.cart-body{
height:100%;
flex: 1;
margin-bottom: 50px;
display: flex;
background-color:#fff;
overflow-y: auto;
position: relative;
.cart-main{
width:100%;
>.am-list-item{
border-bottom: 1px solid #eee;
.am-list-line::after{
background-color: transparent;
}
}
>.am-list-item.am-list-item-active{
background-color: transparent;
}
.cart-c-title{
display: flex;
align-items: center;
justify-content: space-between;
>div{
flex:1;
}
span{
font-size:14px;
margin-left:10px;
}
.next{
width:14px;
height:14px;
display: inline-block;
margin-left:10px;
}
i{
font-style: inherit;
font-size:14px;
display: block;
padding:0 10px;
}
}
.cart-c-body{
.am-list-item-active{
background-color: transparent;
}
.am-list-line{
padding-right: 0px;
}
border-bottom: 1px solid #eee;
.am-list-content{
position: relative;
}
.cart-c-item{
overflow: hidden;
position: relative;
padding:10px 10px 10px 0;
box-sizing: border-box;
.cart-c-check{
width:40px;
display: flex;
align-items: center;
justify-content: center;
height:calc(100% - 20px);
box-sizing: border-box;
position: absolute;
}
}
.cart-ci-left{
position: absolute;
top: 0;
left: 40px;
height: 100%;
overflow: hidden;
display: flex;
justify-content: center;
align-items: center;
img{
height:85px;
width:85px;
display: block;
border:1px solid #eee;
}
}
.cart-ci-right{
min-height:87px;
margin-left:135px;
margin-right:8px;
.am-stepper-handler{
line-height: 28px;
font-size: 14px;
width: 26px;
height: 26px;
display:flex;
justify-content: center;
align-items: center;
}
.r-title{
font-size:15px;
white-space:normal;
font-weight:bold;
overflow : hidden;
max-height: 46px;
span{
overflow : hidden;
text-overflow: ellipsis;
display: -webkit-box;
/* autoprefixer: ignore next */
-webkit-box-orient: vertical;
white-space:inherit;
-webkit-line-clamp: 2;
}
}
.r-step{
display: flex;
justify-content: space-between;
.r-price{
color:#ff5b05;
font-size:14px;
line-height:30px;
span{
font-size:12px;
}
}
.span-stepper{
width:100px;
}
.am-stepper-input{
font-size:12px;
}
}
}
}
}
}
.cart-footer{
width: 100%;
display: flex;
position: absolute;
bottom: 0;
justify-content: space-between;
border-top:1px solid #eee;
background-color:rgba(255,255,255,.7);
height:50px;
.cart-label{
display: flex;
}
&>div:nth-child(1){
text-align: center;
height: 50px;
line-height: 50px;
padding-left: 12px;
div{
font-size: $font_16;
color: $color_333;
margin-left: 6px;
}
}
.all-pirce{
flex:1;
margin-right: 20px;
display: flex;
align-items: center;
p{
margin:0;
padding:0;
font-size: $font_16;
text-align: right;
width:100%;
span{
color: $color_333;
font-size: $font_16;
}
span:nth-child(2){
color: $red;
}
}
}
&>div:nth-child(3){
width: 100px;
line-height: 50px;
text-align: center;
font-size: $font_16;
background-color: $bg_ff3131;
color: $white;
span{
font-size: 10px;
font-weight:400;
}
}
div.active{
background-color: #ff5b05;
color:#fff;
}
}
}
.shopcard-check{
display: flex;
justify-items: center;
align-items: center;
padding-right: 12px;
}
.card-wrap{
margin-left: 40px;
}
.history/src/components/shopCard/card_20190429143714.scss 0 → 100644
.cart-page{
height: 100%;
width: 100%;
display: flex;
flex-direction: column;
.cart-tip{
display: flex;
align-items:center;
justify-content: center;
min-height: 60px;
color:#555;
}
.edit{
padding-right:10px;
font-size:14px;
}
.cart-body{
height:100%;
flex: 1;
margin-bottom: 50px;
display: flex;
background-color: $bg_f5f5f5;
overflow-y: auto;
position: relative;
.cart-main{
width:100%;
>.am-list-item{
border-bottom: 1px solid #eee;
.am-list-line::after{
background-color: transparent;
}
}
>.am-list-item.am-list-item-active{
background-color: transparent;
}
.cart-c-title{
display: flex;
align-items: center;
justify-content: space-between;
>div{
flex:1;
}
span{
font-size:14px;
margin-left:10px;
}
.next{
width:14px;
height:14px;
display: inline-block;
margin-left:10px;
}
i{
font-style: inherit;
font-size:14px;
display: block;
padding:0 10px;
}
}
.cart-c-body{
.am-list-item-active{
background-color: transparent;
}
.am-list-line{
padding-right: 0px;
}
border-bottom: 1px solid #eee;
.am-list-content{
position: relative;
}
.cart-c-item{
overflow: hidden;
position: relative;
padding:10px 10px 10px 0;
box-sizing: border-box;
.cart-c-check{
width:40px;
display: flex;
align-items: center;
justify-content: center;
height:calc(100% - 20px);
box-sizing: border-box;
position: absolute;
}
}
.cart-ci-left{
position: absolute;
top: 0;
left: 40px;
height: 100%;
overflow: hidden;
display: flex;
justify-content: center;
align-items: center;
img{
height:85px;
width:85px;
display: block;
border:1px solid #eee;
}
}
.cart-ci-right{
min-height:87px;
margin-left:135px;
margin-right:8px;
.am-stepper-handler{
line-height: 28px;
font-size: 14px;
width: 26px;
height: 26px;
display:flex;
justify-content: center;
align-items: center;
}
.r-title{
font-size:15px;
white-space:normal;
font-weight:bold;
overflow : hidden;
max-height: 46px;
span{
overflow : hidden;
text-overflow: ellipsis;
display: -webkit-box;
/* autoprefixer: ignore next */
-webkit-box-orient: vertical;
white-space:inherit;
-webkit-line-clamp: 2;
}
}
.r-step{
display: flex;
justify-content: space-between;
.r-price{
color:#ff5b05;
font-size:14px;
line-height:30px;
span{
font-size:12px;
}
}
.span-stepper{
width:100px;
}
.am-stepper-input{
font-size:12px;
}
}
}
}
}
}
.cart-footer{
width: 100%;
display: flex;
position: absolute;
bottom: 0;
justify-content: space-between;
border-top:1px solid #eee;
background-color:rgba(255,255,255,.7);
height:50px;
.cart-label{
display: flex;
}
&>div:nth-child(1){
text-align: center;
height: 50px;
line-height: 50px;
padding-left: 12px;
div{
font-size: $font_16;
color: $color_333;
margin-left: 6px;
}
}
.all-pirce{
flex:1;
margin-right: 20px;
display: flex;
align-items: center;
p{
margin:0;
padding:0;
font-size: $font_16;
text-align: right;
width:100%;
span{
color: $color_333;
font-size: $font_16;
}
span:nth-child(2){
color: $red;
}
}
}
&>div:nth-child(3){
width: 100px;
line-height: 50px;
text-align: center;
font-size: $font_16;
background-color: $bg_ff3131;
color: $white;
span{
font-size: 10px;
font-weight:400;
}
}
div.active{
background-color: #ff5b05;
color:#fff;
}
}
}
.shopcard-check{
display: flex;
justify-items: center;
align-items: center;
padding-right: 12px;
}
.card-wrap{
margin-left: 40px;
}
.history/src/components/shopCard/card_20190429143856.scss 0 → 100644
.cart-page{
height: 100%;
width: 100%;
display: flex;
flex-direction: column;
.cart-tip{
display: flex;
align-items:center;
justify-content: center;
min-height: 60px;
color:#555;
}
.edit{
padding-right:10px;
font-size:14px;
}
.cart-body{
height:100%;
flex: 1;
margin-bottom: 50px;
display: flex;
background-color: $bg_f5f5f5;
overflow-y: auto;
position: relative;
.cart-main{
width:100%;
>.am-list-item{
border-bottom: 1px solid #eee;
.am-list-line::after{
background-color: transparent;
}
}
>.am-list-item.am-list-item-active{
background-color: transparent;
}
.cart-c-title{
display: flex;
align-items: center;
justify-content: space-between;
>div{
flex:1;
}
span{
font-size:14px;
margin-left:10px;
}
.next{
width:14px;
height:14px;
display: inline-block;
margin-left:10px;
}
i{
font-style: inherit;
font-size:14px;
display: block;
padding:0 10px;
}
}
.cart-c-body{
.am-list-item-active{
background-color: transparent;
}
.am-list-line{
padding-right: 0px;
}
border-bottom: 1px solid #eee;
.am-list-content{
position: relative;
}
.cart-c-item{
overflow: hidden;
position: relative;
padding: 8px 0;
box-sizing: border-box;
.cart-c-check{
width:40px;
display: flex;
align-items: center;
justify-content: center;
height:calc(100% - 20px);
box-sizing: border-box;
position: absolute;
}
}
.cart-ci-left{
position: absolute;
top: 0;
left: 40px;
height: 100%;
overflow: hidden;
display: flex;
justify-content: center;
align-items: center;
img{
height:85px;
width:85px;
display: block;
border:1px solid #eee;
}
}
.cart-ci-right{
min-height:87px;
margin-left:135px;
margin-right:8px;
.am-stepper-handler{
line-height: 28px;
font-size: 14px;
width: 26px;
height: 26px;
display:flex;
justify-content: center;
align-items: center;
}
.r-title{
font-size:15px;
white-space:normal;
font-weight:bold;
overflow : hidden;
max-height: 46px;
span{
overflow : hidden;
text-overflow: ellipsis;
display: -webkit-box;
/* autoprefixer: ignore next */
-webkit-box-orient: vertical;
white-space:inherit;
-webkit-line-clamp: 2;
}
}
.r-step{
display: flex;
justify-content: space-between;
.r-price{
color:#ff5b05;
font-size:14px;
line-height:30px;
span{
font-size:12px;
}
}
.span-stepper{
width:100px;
}
.am-stepper-input{
font-size:12px;
}
}
}
}
}
}
.cart-footer{
width: 100%;
display: flex;
position: absolute;
bottom: 0;
justify-content: space-between;
border-top:1px solid #eee;
background-color:rgba(255,255,255,.7);
height:50px;
.cart-label{
display: flex;
}
&>div:nth-child(1){
text-align: center;
height: 50px;
line-height: 50px;
padding-left: 12px;
div{
font-size: $font_16;
color: $color_333;
margin-left: 6px;
}
}
.all-pirce{
flex:1;
margin-right: 20px;
display: flex;
align-items: center;
p{
margin:0;
padding:0;
font-size: $font_16;
text-align: right;
width:100%;
span{
color: $color_333;
font-size: $font_16;
}
span:nth-child(2){
color: $red;
}
}
}
&>div:nth-child(3){
width: 100px;
line-height: 50px;
text-align: center;
font-size: $font_16;
background-color: $bg_ff3131;
color: $white;
span{
font-size: 10px;
font-weight:400;
}
}
div.active{
background-color: #ff5b05;
color:#fff;
}
}
}
.shopcard-check{
display: flex;
justify-items: center;
align-items: center;
padding-right: 12px;
}
.card-wrap{
margin-left: 40px;
}
.history/src/components/shopCard/card_20190429144000.scss 0 → 100644
.cart-page{
height: 100%;
width: 100%;
display: flex;
flex-direction: column;
.cart-tip{
display: flex;
align-items:center;
justify-content: center;
min-height: 60px;
color:#555;
}
.edit{
padding-right:10px;
font-size:14px;
}
.cart-body{
height:100%;
flex: 1;
margin-bottom: 50px;
display: flex;
background-color: $bg_f5f5f5;
overflow-y: auto;
position: relative;
.cart-main{
width:100%;
>.am-list-item{
border-bottom: 1px solid #eee;
.am-list-line::after{
background-color: transparent;
}
}
>.am-list-item.am-list-item-active{
background-color: transparent;
}
.cart-c-title{
display: flex;
align-items: center;
justify-content: space-between;
>div{
flex:1;
}
span{
font-size:14px;
margin-left:10px;
}
.next{
width:14px;
height:14px;
display: inline-block;
margin-left:10px;
}
i{
font-style: inherit;
font-size:14px;
display: block;
padding:0 10px;
}
}
.cart-c-body{
.am-list-item-active{
background-color: transparent;
}
.am-list-line{
padding-right: 0px;
}
.am-list-content{
position: relative;
}
.cart-c-item{
overflow: hidden;
position: relative;
padding: 8px 0;
box-sizing: border-box;
.cart-c-check{
width:40px;
display: flex;
align-items: center;
justify-content: center;
height:calc(100% - 20px);
box-sizing: border-box;
position: absolute;
}
}
.cart-ci-left{
position: absolute;
top: 0;
left: 40px;
height: 100%;
overflow: hidden;
display: flex;
justify-content: center;
align-items: center;
img{
height:85px;
width:85px;
display: block;
border:1px solid #eee;
}
}
.cart-ci-right{
min-height:87px;
margin-left:135px;
margin-right:8px;
.am-stepper-handler{
line-height: 28px;
font-size: 14px;
width: 26px;
height: 26px;
display:flex;
justify-content: center;
align-items: center;
}
.r-title{
font-size:15px;
white-space:normal;
font-weight:bold;
overflow : hidden;
max-height: 46px;
span{
overflow : hidden;
text-overflow: ellipsis;
display: -webkit-box;
/* autoprefixer: ignore next */
-webkit-box-orient: vertical;
white-space:inherit;
-webkit-line-clamp: 2;
}
}
.r-step{
display: flex;
justify-content: space-between;
.r-price{
color:#ff5b05;
font-size:14px;
line-height:30px;
span{
font-size:12px;
}
}
.span-stepper{
width:100px;
}
.am-stepper-input{
font-size:12px;
}
}
}
}
}
}
.cart-footer{
width: 100%;
display: flex;
position: absolute;
bottom: 0;
justify-content: space-between;
border-top:1px solid #eee;
background-color:rgba(255,255,255,.7);
height:50px;
.cart-label{
display: flex;
}
&>div:nth-child(1){
text-align: center;
height: 50px;
line-height: 50px;
padding-left: 12px;
div{
font-size: $font_16;
color: $color_333;
margin-left: 6px;
}
}
.all-pirce{
flex:1;
margin-right: 20px;
display: flex;
align-items: center;
p{
margin:0;
padding:0;
font-size: $font_16;
text-align: right;
width:100%;
span{
color: $color_333;
font-size: $font_16;
}
span:nth-child(2){
color: $red;
}
}
}
&>div:nth-child(3){
width: 100px;
line-height: 50px;
text-align: center;
font-size: $font_16;
background-color: $bg_ff3131;
color: $white;
span{
font-size: 10px;
font-weight:400;
}
}
div.active{
background-color: #ff5b05;
color:#fff;
}
}
}
.shopcard-check{
display: flex;
justify-items: center;
align-items: center;
padding-right: 12px;
}
.card-wrap{
margin-left: 40px;
}
.history/src/components/shopCard/card_20190429144052.scss 0 → 100644
.cart-page{
height: 100%;
width: 100%;
display: flex;
flex-direction: column;
.cart-tip{
display: flex;
align-items:center;
justify-content: center;
min-height: 60px;
color:#555;
}
.edit{
padding-right:10px;
font-size:14px;
}
.cart-body{
height:100%;
flex: 1;
margin-bottom: 50px;
display: flex;
background-color: $bg_f5f5f5;
overflow-y: auto;
position: relative;
.cart-main{
width:100%;
>.am-list-item{
border-bottom: 1px solid #eee;
.am-list-line::after{
background-color: transparent;
}
}
>.am-list-item.am-list-item-active{
background-color: transparent;
}
.cart-c-title{
display: flex;
align-items: center;
justify-content: space-between;
>div{
flex:1;
}
span{
font-size:14px;
margin-left:10px;
}
.next{
width:14px;
height:14px;
display: inline-block;
margin-left:10px;
}
i{
font-style: inherit;
font-size:14px;
display: block;
padding:0 10px;
}
}
.cart-c-body{
.am-list-item-active{
background-color: transparent;
}
.am-list-line{
padding-right: 0px;
}
.am-list-content{
position: relative;
}
.cart-c-item{
overflow: hidden;
position: relative;
margin: 8px 0;
box-sizing: border-box;
background-color: $white;
.cart-c-check{
width:40px;
display: flex;
align-items: center;
justify-content: center;
height:calc(100% - 20px);
box-sizing: border-box;
position: absolute;
}
}
.cart-ci-left{
position: absolute;
top: 0;
left: 40px;
height: 100%;
overflow: hidden;
display: flex;
justify-content: center;
align-items: center;
img{
height:85px;
width:85px;
display: block;
border:1px solid #eee;
}
}
.cart-ci-right{
min-height:87px;
margin-left:135px;
margin-right:8px;
.am-stepper-handler{
line-height: 28px;
font-size: 14px;
width: 26px;
height: 26px;
display:flex;
justify-content: center;
align-items: center;
}
.r-title{
font-size:15px;
white-space:normal;
font-weight:bold;
overflow : hidden;
max-height: 46px;
span{
overflow : hidden;
text-overflow: ellipsis;
display: -webkit-box;
/* autoprefixer: ignore next */
-webkit-box-orient: vertical;
white-space:inherit;
-webkit-line-clamp: 2;
}
}
.r-step{
display: flex;
justify-content: space-between;
.r-price{
color:#ff5b05;
font-size:14px;
line-height:30px;
span{
font-size:12px;
}
}
.span-stepper{
width:100px;
}
.am-stepper-input{
font-size:12px;
}
}
}
}
}
}
.cart-footer{
width: 100%;
display: flex;
position: absolute;
bottom: 0;
justify-content: space-between;
border-top:1px solid #eee;
background-color:rgba(255,255,255,.7);
height:50px;
.cart-label{
display: flex;
}
&>div:nth-child(1){
text-align: center;
height: 50px;
line-height: 50px;
padding-left: 12px;
div{
font-size: $font_16;
color: $color_333;
margin-left: 6px;
}
}
.all-pirce{
flex:1;
margin-right: 20px;
display: flex;
align-items: center;
p{
margin:0;
padding:0;
font-size: $font_16;
text-align: right;
width:100%;
span{
color: $color_333;
font-size: $font_16;
}
span:nth-child(2){
color: $red;
}
}
}
&>div:nth-child(3){
width: 100px;
line-height: 50px;
text-align: center;
font-size: $font_16;
background-color: $bg_ff3131;
color: $white;
span{
font-size: 10px;
font-weight:400;
}
}
div.active{
background-color: #ff5b05;
color:#fff;
}
}
}
.shopcard-check{
display: flex;
justify-items: center;
align-items: center;
padding-right: 12px;
}
.card-wrap{
margin-left: 40px;
}
.history/src/components/shopCard/card_20190429145329.scss 0 → 100644
.cart-page{
height: 100%;
width: 100%;
display: flex;
flex-direction: column;
.cart-tip{
display: flex;
align-items:center;
justify-content: center;
min-height: 60px;
color:#555;
}
.edit{
padding-right:10px;
font-size:14px;
}
.cart-body{
height:100%;
flex: 1;
margin-bottom: 50px;
display: flex;
background-color: $bg_f5f5f5;
overflow-y: auto;
position: relative;
.cart-main{
width:100%;
>.am-list-item{
border-bottom: 1px solid #eee;
.am-list-line::after{
background-color: transparent;
}
}
>.am-list-item.am-list-item-active{
background-color: transparent;
}
.cart-c-title{
display: flex;
align-items: center;
justify-content: space-between;
>div{
flex:1;
}
span{
font-size:14px;
margin-left:10px;
}
.next{
width:14px;
height:14px;
display: inline-block;
margin-left:10px;
}
i{
font-style: inherit;
font-size:14px;
display: block;
padding:0 10px;
}
}
.cart-c-body{
.am-list-item-active{
background-color: transparent;
}
.am-list-line{
padding-right: 0px;
}
.am-list-content{
position: relative;
}
.cart-c-item{
overflow: hidden;
position: relative;
margin: 8px 0;
padding-right: 10px;
box-sizing: border-box;
background-color: $white;
.cart-c-check{
width:40px;
display: flex;
align-items: center;
justify-content: center;
height:calc(100% - 20px);
box-sizing: border-box;
position: absolute;
}
}
.cart-ci-left{
position: absolute;
top: 0;
left: 40px;
height: 100%;
overflow: hidden;
display: flex;
justify-content: center;
align-items: center;
img{
height:85px;
width:85px;
display: block;
border:1px solid #eee;
}
}
.cart-ci-right{
min-height:87px;
margin-left:135px;
margin-right:8px;
.am-stepper-handler{
line-height: 28px;
font-size: 14px;
width: 26px;
height: 26px;
display:flex;
justify-content: center;
align-items: center;
}
.r-title{
font-size:15px;
white-space:normal;
font-weight:bold;
overflow : hidden;
max-height: 46px;
span{
overflow : hidden;
text-overflow: ellipsis;
display: -webkit-box;
/* autoprefixer: ignore next */
-webkit-box-orient: vertical;
white-space:inherit;
-webkit-line-clamp: 2;
}
}
.r-step{
display: flex;
justify-content: space-between;
.r-price{
color:#ff5b05;
font-size:14px;
line-height:30px;
span{
font-size:12px;
}
}
.span-stepper{
width:100px;
}
.am-stepper-input{
font-size:12px;
}
}
}
}
}
}
.cart-footer{
width: 100%;
display: flex;
position: absolute;
bottom: 0;
justify-content: space-between;
border-top:1px solid #eee;
background-color:rgba(255,255,255,.7);
height:50px;
.cart-label{
display: flex;
}
&>div:nth-child(1){
text-align: center;
height: 50px;
line-height: 50px;
padding-left: 12px;
div{
font-size: $font_16;
color: $color_333;
margin-left: 6px;
}
}
.all-pirce{
flex:1;
margin-right: 20px;
display: flex;
align-items: center;
p{
margin:0;
padding:0;
font-size: $font_16;
text-align: right;
width:100%;
span{
color: $color_333;
font-size: $font_16;
}
span:nth-child(2){
color: $red;
}
}
}
&>div:nth-child(3){
width: 100px;
line-height: 50px;
text-align: center;
font-size: $font_16;
background-color: $bg_ff3131;
color: $white;
span{
font-size: 10px;
font-weight:400;
}
}
div.active{
background-color: #ff5b05;
color:#fff;
}
}
}
.shopcard-check{
display: flex;
justify-items: center;
align-items: center;
padding-right: 12px;
}
.card-wrap{
margin-left: 40px;
}
.history/src/components/shopCard/card_20190429145455.scss 0 → 100644
.cart-page{
height: 100%;
width: 100%;
display: flex;
flex-direction: column;
.cart-tip{
display: flex;
align-items:center;
justify-content: center;
min-height: 60px;
color:#555;
}
.edit{
padding-right:10px;
font-size:14px;
}
.cart-body{
height:100%;
flex: 1;
margin-bottom: 50px;
display: flex;
background-color: $bg_f5f5f5;
overflow-y: auto;
position: relative;
.cart-main{
width:100%;
>.am-list-item{
border-bottom: 1px solid #eee;
.am-list-line::after{
background-color: transparent;
}
}
>.am-list-item.am-list-item-active{
background-color: transparent;
}
.cart-c-title{
display: flex;
align-items: center;
justify-content: space-between;
>div{
flex:1;
}
span{
font-size:14px;
margin-left:10px;
}
.next{
width:14px;
height:14px;
display: inline-block;
margin-left:10px;
}
i{
font-style: inherit;
font-size:14px;
display: block;
padding:0 10px;
}
}
.cart-c-body{
.am-list-item-active{
background-color: transparent;
}
.am-list-line{
padding-right: 0px;
}
.am-list-content{
position: relative;
}
.cart-c-item{
overflow: hidden;
position: relative;
margin: 8px 0;
padding-right: 10px;
box-sizing: border-box;
background-color: $white;
.cart-c-check{
width:40px;
display: flex;
align-items: center;
justify-content: center;
height: 100%;
box-sizing: border-box;
position: absolute;
}
}
.cart-ci-left{
position: absolute;
top: 0;
left: 40px;
height: 100%;
overflow: hidden;
display: flex;
justify-content: center;
align-items: center;
img{
height:85px;
width:85px;
display: block;
border:1px solid #eee;
}
}
.cart-ci-right{
min-height:87px;
margin-left:135px;
margin-right:8px;
.am-stepper-handler{
line-height: 28px;
font-size: 14px;
width: 26px;
height: 26px;
display:flex;
justify-content: center;
align-items: center;
}
.r-title{
font-size:15px;
white-space:normal;
font-weight:bold;
overflow : hidden;
max-height: 46px;
span{
overflow : hidden;
text-overflow: ellipsis;
display: -webkit-box;
/* autoprefixer: ignore next */
-webkit-box-orient: vertical;
white-space:inherit;
-webkit-line-clamp: 2;
}
}
.r-step{
display: flex;
justify-content: space-between;
.r-price{
color:#ff5b05;
font-size:14px;
line-height:30px;
span{
font-size:12px;
}
}
.span-stepper{
width:100px;
}
.am-stepper-input{
font-size:12px;
}
}
}
}
}
}
.cart-footer{
width: 100%;
display: flex;
position: absolute;
bottom: 0;
justify-content: space-between;
border-top:1px solid #eee;
background-color:rgba(255,255,255,.7);
height:50px;
.cart-label{
display: flex;
}
&>div:nth-child(1){
text-align: center;
height: 50px;
line-height: 50px;
padding-left: 12px;
div{
font-size: $font_16;
color: $color_333;
margin-left: 6px;
}
}
.all-pirce{
flex:1;
margin-right: 20px;
display: flex;
align-items: center;
p{
margin:0;
padding:0;
font-size: $font_16;
text-align: right;
width:100%;
span{
color: $color_333;
font-size: $font_16;
}
span:nth-child(2){
color: $red;
}
}
}
&>div:nth-child(3){
width: 100px;
line-height: 50px;
text-align: center;
font-size: $font_16;
background-color: $bg_ff3131;
color: $white;
span{
font-size: 10px;
font-weight:400;
}
}
div.active{
background-color: #ff5b05;
color:#fff;
}
}
}
.shopcard-check{
display: flex;
justify-items: center;
align-items: center;
padding-right: 12px;
}
.card-wrap{
margin-left: 40px;
}
.history/src/components/shopCard/index_20190429094206.js 0 → 100644
import React, { Component } from 'react'
import { connect } from 'react-redux'
import { Checkbox, NavBar } from 'antd-mobile'
//组件
import { OrderItem } from '@/common/index'
import Loading from '@base/Loading'
//css
import './card.scss'
import classnames from 'classnames'
const mockData = [
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
}
]
function OrderList(props) {
const listData = props.list;
return (
<div style={{"backgroundColor": "#f5f5f5"}}>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
const Tab = (
<div className="shopcard-check">
<Checkbox
checked={item.check}
onChange={(e) => {
// this.onChange(e, item.id)
}}
/>
</div>
)
return (
<OrderItem {...item} key={index} tab={ Tab } info={Info}>
</OrderItem>
)
})
}
</div>
);
}
class Cart extends Component {
constructor(props) {
super(props)
this.state = {
deleteAll: false,
loading: false,
checkedNum: 0,
allPrice: 0,
cartNmu: 0,
data: mockData
}
this.checkChange = this.checkChange.bind(this);
}
//获取购物车列表
getCartList() {
}
//全选
allChange(e) {
let checked = e.target.checked
let newData = this.state.data.map((item, i) => {
return {
...item,
check: checked
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//点击
checkChange(id, check) {
let newData = this.state.data.map((item, i) => {
if (item.id === id) {
return {
...item,
check: check
}
} else {
return item;
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//计算总价
calc(newData) {
let allPrice = 0;
let checkedNum = 0;
let cartNmu = 0;
newData.forEach((item, i) => {
if (item.check) {
cartNmu += 1;
checkedNum += i;
allPrice += parseFloat(item.newprice);
}
})
this.setState({
checkedNum,
allPrice,
cartNmu
})
}
//购买
buy() {
}
deleteAll() {
}
//装载组件
componentDidMount() {
this.getCartList()
}
render() {
return (
<div className="cart-page" style={{ overflow: 'hidden' }}>
<NavBar
style={{ "height": "44px" }}
className="order-tab"
mode="light"
icon={<i style={{"fontSize": '24px'}} className="iconfont iconiconfront-68"></i>}
rightContent={[
<i key="0" style={{ "fontSize": '24px' }} className="iconfont iconiconfront-56"></i>
]}
>
购物车
</NavBar>
<div className="cart-body">
{
this.state.loading ?
<Loading />
:
<OrderList checkChange={this.checkChange} list={this.state.data} />
}
{
this.state.deleteAll ?
<div className="cart-footer">
<div>
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div></div>
<div className={classnames({
'active': this.state.cartNmu > 0
})}
onClick={() => {
if (this.state.cartNmu > 0) {
this.delete()
}
}}>
删除<span>({this.state.cartNmu})</span>
</div>
</div>
:
<div className="cart-footer">
<div className="cart-label">
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div className="all-pirce">
<p>
<span>合计：</span>
<span>￥{this.state.allPrice}</span>
</p>
</div>
<div className={classnames({
'active': this.state.checkedNum > 0
})} onClick={() => {
if (this.state.checkedNum > 0) {
this.buy()
}
}}>
去结算<span>({this.state.checkedNum})</span>
</div>
</div>
}
</div>
</div>
)
}
}
export default connect()(Cart)
\ No newline at end of file
.history/src/components/shopCard/index_20190429095711.js 0 → 100644
import React, { Component } from 'react'
import { connect } from 'react-redux'
import { Checkbox, NavBar } from 'antd-mobile'
//组件
import { OrderItem } from '.cardList'
import Loading from '@base/Loading'
//css
import './card.scss'
import classnames from 'classnames'
const mockData = [
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
}
]
function OrderList(props) {
const listData = props.list;
return (
<div style={{"backgroundColor": "#f5f5f5"}}>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
const Tab = (
<div className="shopcard-check">
<Checkbox
checked={item.check}
onChange={(e) => {
// this.onChange(e, item.id)
}}
/>
</div>
)
return (
<OrderItem {...item} key={index} tab={ Tab } info={Info}>
</OrderItem>
)
})
}
</div>
);
}
class Cart extends Component {
constructor(props) {
super(props)
this.state = {
deleteAll: false,
loading: false,
checkedNum: 0,
allPrice: 0,
cartNmu: 0,
data: mockData
}
this.checkChange = this.checkChange.bind(this);
}
//获取购物车列表
getCartList() {
}
//全选
allChange(e) {
let checked = e.target.checked
let newData = this.state.data.map((item, i) => {
return {
...item,
check: checked
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//点击
checkChange(id, check) {
let newData = this.state.data.map((item, i) => {
if (item.id === id) {
return {
...item,
check: check
}
} else {
return item;
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//计算总价
calc(newData) {
let allPrice = 0;
let checkedNum = 0;
let cartNmu = 0;
newData.forEach((item, i) => {
if (item.check) {
cartNmu += 1;
checkedNum += i;
allPrice += parseFloat(item.newprice);
}
})
this.setState({
checkedNum,
allPrice,
cartNmu
})
}
//购买
buy() {
}
deleteAll() {
}
//装载组件
componentDidMount() {
this.getCartList()
}
render() {
return (
<div className="cart-page" style={{ overflow: 'hidden' }}>
<NavBar
style={{ "height": "44px" }}
className="order-tab"
mode="light"
icon={<i style={{"fontSize": '24px'}} className="iconfont iconiconfront-68"></i>}
rightContent={[
<i key="0" style={{ "fontSize": '24px' }} className="iconfont iconiconfront-56"></i>
]}
>
购物车
</NavBar>
<div className="cart-body">
{
this.state.loading ?
<Loading />
:
<OrderList checkChange={this.checkChange} list={this.state.data} />
}
{
this.state.deleteAll ?
<div className="cart-footer">
<div>
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div></div>
<div className={classnames({
'active': this.state.cartNmu > 0
})}
onClick={() => {
if (this.state.cartNmu > 0) {
this.delete()
}
}}>
删除<span>({this.state.cartNmu})</span>
</div>
</div>
:
<div className="cart-footer">
<div className="cart-label">
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div className="all-pirce">
<p>
<span>合计：</span>
<span>￥{this.state.allPrice}</span>
</p>
</div>
<div className={classnames({
'active': this.state.checkedNum > 0
})} onClick={() => {
if (this.state.checkedNum > 0) {
this.buy()
}
}}>
去结算<span>({this.state.checkedNum})</span>
</div>
</div>
}
</div>
</div>
)
}
}
export default connect()(Cart)
\ No newline at end of file
.history/src/components/shopCard/index_20190429095719.js 0 → 100644
import React, { Component } from 'react'
import { connect } from 'react-redux'
import { Checkbox, NavBar } from 'antd-mobile'
//组件
import { OrderItem } from './cardList'
import Loading from '@base/Loading'
//css
import './card.scss'
import classnames from 'classnames'
const mockData = [
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
}
]
function OrderList(props) {
const listData = props.list;
return (
<div style={{"backgroundColor": "#f5f5f5"}}>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
const Tab = (
<div className="shopcard-check">
<Checkbox
checked={item.check}
onChange={(e) => {
// this.onChange(e, item.id)
}}
/>
</div>
)
return (
<OrderItem {...item} key={index} tab={ Tab } info={Info}>
</OrderItem>
)
})
}
</div>
);
}
class Cart extends Component {
constructor(props) {
super(props)
this.state = {
deleteAll: false,
loading: false,
checkedNum: 0,
allPrice: 0,
cartNmu: 0,
data: mockData
}
this.checkChange = this.checkChange.bind(this);
}
//获取购物车列表
getCartList() {
}
//全选
allChange(e) {
let checked = e.target.checked
let newData = this.state.data.map((item, i) => {
return {
...item,
check: checked
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//点击
checkChange(id, check) {
let newData = this.state.data.map((item, i) => {
if (item.id === id) {
return {
...item,
check: check
}
} else {
return item;
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//计算总价
calc(newData) {
let allPrice = 0;
let checkedNum = 0;
let cartNmu = 0;
newData.forEach((item, i) => {
if (item.check) {
cartNmu += 1;
checkedNum += i;
allPrice += parseFloat(item.newprice);
}
})
this.setState({
checkedNum,
allPrice,
cartNmu
})
}
//购买
buy() {
}
deleteAll() {
}
//装载组件
componentDidMount() {
this.getCartList()
}
render() {
return (
<div className="cart-page" style={{ overflow: 'hidden' }}>
<NavBar
style={{ "height": "44px" }}
className="order-tab"
mode="light"
icon={<i style={{"fontSize": '24px'}} className="iconfont iconiconfront-68"></i>}
rightContent={[
<i key="0" style={{ "fontSize": '24px' }} className="iconfont iconiconfront-56"></i>
]}
>
购物车
</NavBar>
<div className="cart-body">
{
this.state.loading ?
<Loading />
:
<OrderList checkChange={this.checkChange} list={this.state.data} />
}
{
this.state.deleteAll ?
<div className="cart-footer">
<div>
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div></div>
<div className={classnames({
'active': this.state.cartNmu > 0
})}
onClick={() => {
if (this.state.cartNmu > 0) {
this.delete()
}
}}>
删除<span>({this.state.cartNmu})</span>
</div>
</div>
:
<div className="cart-footer">
<div className="cart-label">
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div className="all-pirce">
<p>
<span>合计：</span>
<span>￥{this.state.allPrice}</span>
</p>
</div>
<div className={classnames({
'active': this.state.checkedNum > 0
})} onClick={() => {
if (this.state.checkedNum > 0) {
this.buy()
}
}}>
去结算<span>({this.state.checkedNum})</span>
</div>
</div>
}
</div>
</div>
)
}
}
export default connect()(Cart)
\ No newline at end of file
.history/src/components/shopCard/index_20190429095757.js 0 → 100644
import React, { Component } from 'react'
import { connect } from 'react-redux'
import { Checkbox, NavBar } from 'antd-mobile'
//组件
import { CratList } from './cardList'
import Loading from '@base/Loading'
//css
import './card.scss'
import classnames from 'classnames'
const mockData = [
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
}
]
function OrderList(props) {
const listData = props.list;
return (
<div style={{"backgroundColor": "#f5f5f5"}}>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
const Tab = (
<div className="shopcard-check">
<Checkbox
checked={item.check}
onChange={(e) => {
// this.onChange(e, item.id)
}}
/>
</div>
)
return (
<OrderItem {...item} key={index} tab={ Tab } info={Info}>
</OrderItem>
)
})
}
</div>
);
}
class Cart extends Component {
constructor(props) {
super(props)
this.state = {
deleteAll: false,
loading: false,
checkedNum: 0,
allPrice: 0,
cartNmu: 0,
data: mockData
}
this.checkChange = this.checkChange.bind(this);
}
//获取购物车列表
getCartList() {
}
//全选
allChange(e) {
let checked = e.target.checked
let newData = this.state.data.map((item, i) => {
return {
...item,
check: checked
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//点击
checkChange(id, check) {
let newData = this.state.data.map((item, i) => {
if (item.id === id) {
return {
...item,
check: check
}
} else {
return item;
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//计算总价
calc(newData) {
let allPrice = 0;
let checkedNum = 0;
let cartNmu = 0;
newData.forEach((item, i) => {
if (item.check) {
cartNmu += 1;
checkedNum += i;
allPrice += parseFloat(item.newprice);
}
})
this.setState({
checkedNum,
allPrice,
cartNmu
})
}
//购买
buy() {
}
deleteAll() {
}
//装载组件
componentDidMount() {
this.getCartList()
}
render() {
return (
<div className="cart-page" style={{ overflow: 'hidden' }}>
<NavBar
style={{ "height": "44px" }}
className="order-tab"
mode="light"
icon={<i style={{"fontSize": '24px'}} className="iconfont iconiconfront-68"></i>}
rightContent={[
<i key="0" style={{ "fontSize": '24px' }} className="iconfont iconiconfront-56"></i>
]}
>
购物车
</NavBar>
<div className="cart-body">
{
this.state.loading ?
<Loading />
:
<CratList />
}
{
this.state.deleteAll ?
<div className="cart-footer">
<div>
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div></div>
<div className={classnames({
'active': this.state.cartNmu > 0
})}
onClick={() => {
if (this.state.cartNmu > 0) {
this.delete()
}
}}>
删除<span>({this.state.cartNmu})</span>
</div>
</div>
:
<div className="cart-footer">
<div className="cart-label">
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div className="all-pirce">
<p>
<span>合计：</span>
<span>￥{this.state.allPrice}</span>
</p>
</div>
<div className={classnames({
'active': this.state.checkedNum > 0
})} onClick={() => {
if (this.state.checkedNum > 0) {
this.buy()
}
}}>
去结算<span>({this.state.checkedNum})</span>
</div>
</div>
}
</div>
</div>
)
}
}
export default connect()(Cart)
\ No newline at end of file
.history/src/components/shopCard/index_20190429095852.js 0 → 100644
import React, { Component } from 'react'
import { connect } from 'react-redux'
import { Checkbox, NavBar } from 'antd-mobile'
//组件
import { CradList } from './cardList'
import Loading from '@base/Loading'
//css
import './card.scss'
import classnames from 'classnames'
const mockData = [
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
}
]
function OrderList(props) {
const listData = props.list;
return (
<div style={{"backgroundColor": "#f5f5f5"}}>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
const Tab = (
<div className="shopcard-check">
<Checkbox
checked={item.check}
onChange={(e) => {
// this.onChange(e, item.id)
}}
/>
</div>
)
return (
<OrderItem {...item} key={index} tab={ Tab } info={Info}>
</OrderItem>
)
})
}
</div>
);
}
class Cart extends Component {
constructor(props) {
super(props)
this.state = {
deleteAll: false,
loading: false,
checkedNum: 0,
allPrice: 0,
cartNmu: 0,
data: mockData
}
this.checkChange = this.checkChange.bind(this);
}
//获取购物车列表
getCartList() {
}
//全选
allChange(e) {
let checked = e.target.checked
let newData = this.state.data.map((item, i) => {
return {
...item,
check: checked
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//点击
checkChange(id, check) {
let newData = this.state.data.map((item, i) => {
if (item.id === id) {
return {
...item,
check: check
}
} else {
return item;
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//计算总价
calc(newData) {
let allPrice = 0;
let checkedNum = 0;
let cartNmu = 0;
newData.forEach((item, i) => {
if (item.check) {
cartNmu += 1;
checkedNum += i;
allPrice += parseFloat(item.newprice);
}
})
this.setState({
checkedNum,
allPrice,
cartNmu
})
}
//购买
buy() {
}
deleteAll() {
}
//装载组件
componentDidMount() {
this.getCartList()
}
render() {
return (
<div className="cart-page" style={{ overflow: 'hidden' }}>
<NavBar
style={{ "height": "44px" }}
className="order-tab"
mode="light"
icon={<i style={{"fontSize": '24px'}} className="iconfont iconiconfront-68"></i>}
rightContent={[
<i key="0" style={{ "fontSize": '24px' }} className="iconfont iconiconfront-56"></i>
]}
>
购物车
</NavBar>
<div className="cart-body">
{
this.state.loading ?
<Loading />
:
<CratList />
}
{
this.state.deleteAll ?
<div className="cart-footer">
<div>
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div></div>
<div className={classnames({
'active': this.state.cartNmu > 0
})}
onClick={() => {
if (this.state.cartNmu > 0) {
this.delete()
}
}}>
删除<span>({this.state.cartNmu})</span>
</div>
</div>
:
<div className="cart-footer">
<div className="cart-label">
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div className="all-pirce">
<p>
<span>合计：</span>
<span>￥{this.state.allPrice}</span>
</p>
</div>
<div className={classnames({
'active': this.state.checkedNum > 0
})} onClick={() => {
if (this.state.checkedNum > 0) {
this.buy()
}
}}>
去结算<span>({this.state.checkedNum})</span>
</div>
</div>
}
</div>
</div>
)
}
}
export default connect()(Cart)
\ No newline at end of file
.history/src/components/shopCard/index_20190429095906.js 0 → 100644
import React, { Component } from 'react'
import { connect } from 'react-redux'
import { Checkbox, NavBar } from 'antd-mobile'
//组件
import { CradList } from './cardList'
import Loading from '@base/Loading'
//css
import './card.scss'
import classnames from 'classnames'
const mockData = [
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
}
]
function OrderList(props) {
const listData = props.list;
return (
<div style={{"backgroundColor": "#f5f5f5"}}>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
const Tab = (
<div className="shopcard-check">
<Checkbox
checked={item.check}
onChange={(e) => {
// this.onChange(e, item.id)
}}
/>
</div>
)
return (
<OrderItem {...item} key={index} tab={ Tab } info={Info}>
</OrderItem>
)
})
}
</div>
);
}
class Cart extends Component {
constructor(props) {
super(props)
this.state = {
deleteAll: false,
loading: false,
checkedNum: 0,
allPrice: 0,
cartNmu: 0,
data: mockData
}
this.checkChange = this.checkChange.bind(this);
}
//获取购物车列表
getCartList() {
}
//全选
allChange(e) {
let checked = e.target.checked
let newData = this.state.data.map((item, i) => {
return {
...item,
check: checked
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//点击
checkChange(id, check) {
let newData = this.state.data.map((item, i) => {
if (item.id === id) {
return {
...item,
check: check
}
} else {
return item;
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//计算总价
calc(newData) {
let allPrice = 0;
let checkedNum = 0;
let cartNmu = 0;
newData.forEach((item, i) => {
if (item.check) {
cartNmu += 1;
checkedNum += i;
allPrice += parseFloat(item.newprice);
}
})
this.setState({
checkedNum,
allPrice,
cartNmu
})
}
//购买
buy() {
}
deleteAll() {
}
//装载组件
componentDidMount() {
this.getCartList()
}
render() {
return (
<div className="cart-page" style={{ overflow: 'hidden' }}>
<NavBar
style={{ "height": "44px" }}
className="order-tab"
mode="light"
icon={<i style={{"fontSize": '24px'}} className="iconfont iconiconfront-68"></i>}
rightContent={[
<i key="0" style={{ "fontSize": '24px' }} className="iconfont iconiconfront-56"></i>
]}
>
购物车
</NavBar>
<div className="cart-body">
{
this.state.loading ?
<Loading />
:
<CradList />
}
{
this.state.deleteAll ?
<div className="cart-footer">
<div>
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div></div>
<div className={classnames({
'active': this.state.cartNmu > 0
})}
onClick={() => {
if (this.state.cartNmu > 0) {
this.delete()
}
}}>
删除<span>({this.state.cartNmu})</span>
</div>
</div>
:
<div className="cart-footer">
<div className="cart-label">
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div className="all-pirce">
<p>
<span>合计：</span>
<span>￥{this.state.allPrice}</span>
</p>
</div>
<div className={classnames({
'active': this.state.checkedNum > 0
})} onClick={() => {
if (this.state.checkedNum > 0) {
this.buy()
}
}}>
去结算<span>({this.state.checkedNum})</span>
</div>
</div>
}
</div>
</div>
)
}
}
export default connect()(Cart)
\ No newline at end of file
.history/src/components/shopCard/index_20190429100037.js 0 → 100644
import React, { Component } from 'react'
import { connect } from 'react-redux'
import { Checkbox, NavBar } from 'antd-mobile'
//组件
import { CardList } from './cardList'
import Loading from '@base/Loading'
//css
import './card.scss'
import classnames from 'classnames'
const mockData = [
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
}
]
function OrderList(props) {
const listData = props.list;
return (
<div style={{"backgroundColor": "#f5f5f5"}}>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
const Tab = (
<div className="shopcard-check">
<Checkbox
checked={item.check}
onChange={(e) => {
// this.onChange(e, item.id)
}}
/>
</div>
)
return (
<OrderItem {...item} key={index} tab={ Tab } info={Info}>
</OrderItem>
)
})
}
</div>
);
}
class Cart extends Component {
constructor(props) {
super(props)
this.state = {
deleteAll: false,
loading: false,
checkedNum: 0,
allPrice: 0,
cartNmu: 0,
data: mockData
}
this.checkChange = this.checkChange.bind(this);
}
//获取购物车列表
getCartList() {
}
//全选
allChange(e) {
let checked = e.target.checked
let newData = this.state.data.map((item, i) => {
return {
...item,
check: checked
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//点击
checkChange(id, check) {
let newData = this.state.data.map((item, i) => {
if (item.id === id) {
return {
...item,
check: check
}
} else {
return item;
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//计算总价
calc(newData) {
let allPrice = 0;
let checkedNum = 0;
let cartNmu = 0;
newData.forEach((item, i) => {
if (item.check) {
cartNmu += 1;
checkedNum += i;
allPrice += parseFloat(item.newprice);
}
})
this.setState({
checkedNum,
allPrice,
cartNmu
})
}
//购买
buy() {
}
deleteAll() {
}
//装载组件
componentDidMount() {
this.getCartList()
}
render() {
return (
<div className="cart-page" style={{ overflow: 'hidden' }}>
<NavBar
style={{ "height": "44px" }}
className="order-tab"
mode="light"
icon={<i style={{"fontSize": '24px'}} className="iconfont iconiconfront-68"></i>}
rightContent={[
<i key="0" style={{ "fontSize": '24px' }} className="iconfont iconiconfront-56"></i>
]}
>
购物车
</NavBar>
<div className="cart-body">
{
this.state.loading ?
<Loading />
:
<CardList />
}
{
this.state.deleteAll ?
<div className="cart-footer">
<div>
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div></div>
<div className={classnames({
'active': this.state.cartNmu > 0
})}
onClick={() => {
if (this.state.cartNmu > 0) {
this.delete()
}
}}>
删除<span>({this.state.cartNmu})</span>
</div>
</div>
:
<div className="cart-footer">
<div className="cart-label">
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div className="all-pirce">
<p>
<span>合计：</span>
<span>￥{this.state.allPrice}</span>
</p>
</div>
<div className={classnames({
'active': this.state.checkedNum > 0
})} onClick={() => {
if (this.state.checkedNum > 0) {
this.buy()
}
}}>
去结算<span>({this.state.checkedNum})</span>
</div>
</div>
}
</div>
</div>
)
}
}
export default connect()(Cart)
\ No newline at end of file
.history/src/components/shopCard/index_20190429100453.js 0 → 100644
import React, { Component } from 'react'
import { connect } from 'react-redux'
import { Checkbox, NavBar } from 'antd-mobile'
//组件
import { CardList } from './cardList'
import Loading from '@base/Loading'
//css
import './card.scss'
import classnames from 'classnames'
const mockData = [
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
}
]
function OrderList(props) {
const listData = props.list;
return (
<div style={{"backgroundColor": "#f5f5f5"}}>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
const Tab = (
<div className="shopcard-check">
<Checkbox
checked={item.check}
onChange={(e) => {
// this.onChange(e, item.id)
}}
/>
</div>
)
return (
<OrderItem {...item} key={index} tab={ Tab } info={Info}>
</OrderItem>
)
})
}
</div>
);
}
class Cart extends Component {
constructor(props) {
super(props)
this.state = {
deleteAll: false,
loading: false,
checkedNum: 0,
allPrice: 0,
cartNmu: 0,
data: mockData
}
this.checkChange = this.checkChange.bind(this);
}
//获取购物车列表
getCartList() {
}
//全选
allChange(e) {
let checked = e.target.checked
let newData = this.state.data.map((item, i) => {
return {
...item,
check: checked
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//点击
checkChange(id, check) {
let newData = this.state.data.map((item, i) => {
if (item.id === id) {
return {
...item,
check: check
}
} else {
return item;
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//计算总价
calc(newData) {
let allPrice = 0;
let checkedNum = 0;
let cartNmu = 0;
newData.forEach((item, i) => {
if (item.check) {
cartNmu += 1;
checkedNum += i;
allPrice += parseFloat(item.newprice);
}
})
this.setState({
checkedNum,
allPrice,
cartNmu
})
}
//购买
buy() {
}
deleteAll() {
}
//装载组件
componentDidMount() {
this.getCartList()
}
render() {
return (
<div className="cart-page" style={{ overflow: 'hidden' }}>
<NavBar
style={{ "height": "44px" }}
className="order-tab"
mode="light"
icon={<i style={{"fontSize": '24px'}} className="iconfont iconiconfront-68"></i>}
rightContent={[
<i key="0" style={{ "fontSize": '24px' }} className="iconfont iconiconfront-56"></i>
]}
>
购物车
</NavBar>
<div className="cart-body">
{
this.state.loading ?
<Loading />
:
<CardList />
}
{
this.state.deleteAll ?
<div className="cart-footer">
<div>
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div></div>
<div className={classnames({
'active': this.state.cartNmu > 0
})}
onClick={() => {
if (this.state.cartNmu > 0) {
this.delete()
}
}}>
删除<span>({this.state.cartNmu})</span>
</div>
</div>
:
<div className="cart-footer">
<div className="cart-label">
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div className="all-pirce">
<p>
<span>合计：</span>
<span>￥{this.state.allPrice}</span>
</p>
</div>
<div className={classnames({
'active': this.state.checkedNum > 0
})} onClick={() => {
if (this.state.checkedNum > 0) {
this.buy()
}
}}>
去结算<span>({this.state.checkedNum})</span>
</div>
</div>
}
</div>
</div>
)
}
}
export default connect()(Cart)
\ No newline at end of file
.history/src/components/shopCard/index_20190429100541.js 0 → 100644
import React, { Component } from 'react'
import { connect } from 'react-redux'
import { Checkbox, NavBar } from 'antd-mobile'
//组件
import { CardList } from './cardList.js'
import Loading from '@base/Loading'
//css
import './card.scss'
import classnames from 'classnames'
const mockData = [
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
}
]
function OrderList(props) {
const listData = props.list;
return (
<div style={{"backgroundColor": "#f5f5f5"}}>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
const Tab = (
<div className="shopcard-check">
<Checkbox
checked={item.check}
onChange={(e) => {
// this.onChange(e, item.id)
}}
/>
</div>
)
return (
<OrderItem {...item} key={index} tab={ Tab } info={Info}>
</OrderItem>
)
})
}
</div>
);
}
class Cart extends Component {
constructor(props) {
super(props)
this.state = {
deleteAll: false,
loading: false,
checkedNum: 0,
allPrice: 0,
cartNmu: 0,
data: mockData
}
this.checkChange = this.checkChange.bind(this);
}
//获取购物车列表
getCartList() {
}
//全选
allChange(e) {
let checked = e.target.checked
let newData = this.state.data.map((item, i) => {
return {
...item,
check: checked
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//点击
checkChange(id, check) {
let newData = this.state.data.map((item, i) => {
if (item.id === id) {
return {
...item,
check: check
}
} else {
return item;
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//计算总价
calc(newData) {
let allPrice = 0;
let checkedNum = 0;
let cartNmu = 0;
newData.forEach((item, i) => {
if (item.check) {
cartNmu += 1;
checkedNum += i;
allPrice += parseFloat(item.newprice);
}
})
this.setState({
checkedNum,
allPrice,
cartNmu
})
}
//购买
buy() {
}
deleteAll() {
}
//装载组件
componentDidMount() {
this.getCartList()
}
render() {
return (
<div className="cart-page" style={{ overflow: 'hidden' }}>
<NavBar
style={{ "height": "44px" }}
className="order-tab"
mode="light"
icon={<i style={{"fontSize": '24px'}} className="iconfont iconiconfront-68"></i>}
rightContent={[
<i key="0" style={{ "fontSize": '24px' }} className="iconfont iconiconfront-56"></i>
]}
>
购物车
</NavBar>
<div className="cart-body">
{
this.state.loading ?
<Loading />
:
<CardList />
}
{
this.state.deleteAll ?
<div className="cart-footer">
<div>
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div></div>
<div className={classnames({
'active': this.state.cartNmu > 0
})}
onClick={() => {
if (this.state.cartNmu > 0) {
this.delete()
}
}}>
删除<span>({this.state.cartNmu})</span>
</div>
</div>
:
<div className="cart-footer">
<div className="cart-label">
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div className="all-pirce">
<p>
<span>合计：</span>
<span>￥{this.state.allPrice}</span>
</p>
</div>
<div className={classnames({
'active': this.state.checkedNum > 0
})} onClick={() => {
if (this.state.checkedNum > 0) {
this.buy()
}
}}>
去结算<span>({this.state.checkedNum})</span>
</div>
</div>
}
</div>
</div>
)
}
}
export default connect()(Cart)
\ No newline at end of file
.history/src/components/shopCard/index_20190429101003.js 0 → 100644
import React, { Component } from 'react'
import { connect } from 'react-redux'
import { Checkbox, NavBar } from 'antd-mobile'
//组件
import { CardList } from './cardList.js'
import Loading from '@base/Loading'
//css
import './card.scss'
import classnames from 'classnames'
const mockData = [
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
}
]
// function OrderList(props) {
// const listData = props.list;
// return (
// <div style={{"backgroundColor": "#f5f5f5"}}>
// {
// listData.map((item, index) => {
// const Info = (
// <div className="order-info">
// <p className='order-title'>{item.title}</p>
// <p className='order-content'>{item.content}</p>
// <p className='order-des'>
// <span className='order-newprice'>¥{item.newprice}</span>
// <span className='order-price'>¥{item.price}</span>
// </p>
// </div>
// )
// const Tab = (
// <div className="shopcard-check">
// <Checkbox
// checked={item.check}
// onChange={(e) => {
// // this.onChange(e, item.id)
// }}
// />
// </div>
// )
// return (
// <OrderItem {...item} key={index} tab={ Tab } info={Info}>
// </OrderItem>
// )
// })
// }
// </div>
// );
// }
class Cart extends Component {
constructor(props) {
super(props)
this.state = {
deleteAll: false,
loading: false,
checkedNum: 0,
allPrice: 0,
cartNmu: 0,
data: mockData
}
this.checkChange = this.checkChange.bind(this);
}
//获取购物车列表
getCartList() {
}
//全选
allChange(e) {
let checked = e.target.checked
let newData = this.state.data.map((item, i) => {
return {
...item,
check: checked
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//点击
checkChange(id, check) {
let newData = this.state.data.map((item, i) => {
if (item.id === id) {
return {
...item,
check: check
}
} else {
return item;
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//计算总价
calc(newData) {
let allPrice = 0;
let checkedNum = 0;
let cartNmu = 0;
newData.forEach((item, i) => {
if (item.check) {
cartNmu += 1;
checkedNum += i;
allPrice += parseFloat(item.newprice);
}
})
this.setState({
checkedNum,
allPrice,
cartNmu
})
}
//购买
buy() {
}
deleteAll() {
}
//装载组件
componentDidMount() {
this.getCartList()
}
render() {
return (
<div className="cart-page" style={{ overflow: 'hidden' }}>
<NavBar
style={{ "height": "44px" }}
className="order-tab"
mode="light"
icon={<i style={{"fontSize": '24px'}} className="iconfont iconiconfront-68"></i>}
rightContent={[
<i key="0" style={{ "fontSize": '24px' }} className="iconfont iconiconfront-56"></i>
]}
>
购物车
</NavBar>
<div className="cart-body">
{
this.state.loading ?
<Loading />
:
<CardList />
}
{
this.state.deleteAll ?
<div className="cart-footer">
<div>
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div></div>
<div className={classnames({
'active': this.state.cartNmu > 0
})}
onClick={() => {
if (this.state.cartNmu > 0) {
this.delete()
}
}}>
删除<span>({this.state.cartNmu})</span>
</div>
</div>
:
<div className="cart-footer">
<div className="cart-label">
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div className="all-pirce">
<p>
<span>合计：</span>
<span>￥{this.state.allPrice}</span>
</p>
</div>
<div className={classnames({
'active': this.state.checkedNum > 0
})} onClick={() => {
if (this.state.checkedNum > 0) {
this.buy()
}
}}>
去结算<span>({this.state.checkedNum})</span>
</div>
</div>
}
</div>
</div>
)
}
}
export default connect()(Cart)
\ No newline at end of file
.history/src/components/shopCard/index_20190429101101.js 0 → 100644
import React, { Component } from 'react'
import { connect } from 'react-redux'
import { Checkbox, NavBar } from 'antd-mobile'
//组件
// import { CardList } from './cardList.js'
import Loading from '@base/Loading'
//css
import './card.scss'
import classnames from 'classnames'
const mockData = [
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
}
]
// function OrderList(props) {
// const listData = props.list;
// return (
// <div style={{"backgroundColor": "#f5f5f5"}}>
// {
// listData.map((item, index) => {
// const Info = (
// <div className="order-info">
// <p className='order-title'>{item.title}</p>
// <p className='order-content'>{item.content}</p>
// <p className='order-des'>
// <span className='order-newprice'>¥{item.newprice}</span>
// <span className='order-price'>¥{item.price}</span>
// </p>
// </div>
// )
// const Tab = (
// <div className="shopcard-check">
// <Checkbox
// checked={item.check}
// onChange={(e) => {
// // this.onChange(e, item.id)
// }}
// />
// </div>
// )
// return (
// <OrderItem {...item} key={index} tab={ Tab } info={Info}>
// </OrderItem>
// )
// })
// }
// </div>
// );
// }
class Cart extends Component {
constructor(props) {
super(props)
this.state = {
deleteAll: false,
loading: false,
checkedNum: 0,
allPrice: 0,
cartNmu: 0,
data: mockData
}
this.checkChange = this.checkChange.bind(this);
}
//获取购物车列表
getCartList() {
}
//全选
allChange(e) {
let checked = e.target.checked
let newData = this.state.data.map((item, i) => {
return {
...item,
check: checked
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//点击
checkChange(id, check) {
let newData = this.state.data.map((item, i) => {
if (item.id === id) {
return {
...item,
check: check
}
} else {
return item;
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//计算总价
calc(newData) {
let allPrice = 0;
let checkedNum = 0;
let cartNmu = 0;
newData.forEach((item, i) => {
if (item.check) {
cartNmu += 1;
checkedNum += i;
allPrice += parseFloat(item.newprice);
}
})
this.setState({
checkedNum,
allPrice,
cartNmu
})
}
//购买
buy() {
}
deleteAll() {
}
//装载组件
componentDidMount() {
this.getCartList()
}
render() {
return (
<div className="cart-page" style={{ overflow: 'hidden' }}>
<NavBar
style={{ "height": "44px" }}
className="order-tab"
mode="light"
icon={<i style={{"fontSize": '24px'}} className="iconfont iconiconfront-68"></i>}
rightContent={[
<i key="0" style={{ "fontSize": '24px' }} className="iconfont iconiconfront-56"></i>
]}
>
购物车
</NavBar>
<div className="cart-body">
{
this.state.loading ?
<Loading />
:
<CardList />
}
{
this.state.deleteAll ?
<div className="cart-footer">
<div>
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div></div>
<div className={classnames({
'active': this.state.cartNmu > 0
})}
onClick={() => {
if (this.state.cartNmu > 0) {
this.delete()
}
}}>
删除<span>({this.state.cartNmu})</span>
</div>
</div>
:
<div className="cart-footer">
<div className="cart-label">
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div className="all-pirce">
<p>
<span>合计：</span>
<span>￥{this.state.allPrice}</span>
</p>
</div>
<div className={classnames({
'active': this.state.checkedNum > 0
})} onClick={() => {
if (this.state.checkedNum > 0) {
this.buy()
}
}}>
去结算<span>({this.state.checkedNum})</span>
</div>
</div>
}
</div>
</div>
)
}
}
export default connect()(Cart)
\ No newline at end of file
.history/src/components/shopCard/index_20190429101104.js 0 → 100644
import React, { Component } from 'react'
import { connect } from 'react-redux'
import { Checkbox, NavBar } from 'antd-mobile'
//组件
import { CardList } from './cardList.js'
import Loading from '@base/Loading'
//css
import './card.scss'
import classnames from 'classnames'
const mockData = [
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
}
]
// function OrderList(props) {
// const listData = props.list;
// return (
// <div style={{"backgroundColor": "#f5f5f5"}}>
// {
// listData.map((item, index) => {
// const Info = (
// <div className="order-info">
// <p className='order-title'>{item.title}</p>
// <p className='order-content'>{item.content}</p>
// <p className='order-des'>
// <span className='order-newprice'>¥{item.newprice}</span>
// <span className='order-price'>¥{item.price}</span>
// </p>
// </div>
// )
// const Tab = (
// <div className="shopcard-check">
// <Checkbox
// checked={item.check}
// onChange={(e) => {
// // this.onChange(e, item.id)
// }}
// />
// </div>
// )
// return (
// <OrderItem {...item} key={index} tab={ Tab } info={Info}>
// </OrderItem>
// )
// })
// }
// </div>
// );
// }
class Cart extends Component {
constructor(props) {
super(props)
this.state = {
deleteAll: false,
loading: false,
checkedNum: 0,
allPrice: 0,
cartNmu: 0,
data: mockData
}
this.checkChange = this.checkChange.bind(this);
}
//获取购物车列表
getCartList() {
}
//全选
allChange(e) {
let checked = e.target.checked
let newData = this.state.data.map((item, i) => {
return {
...item,
check: checked
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//点击
checkChange(id, check) {
let newData = this.state.data.map((item, i) => {
if (item.id === id) {
return {
...item,
check: check
}
} else {
return item;
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//计算总价
calc(newData) {
let allPrice = 0;
let checkedNum = 0;
let cartNmu = 0;
newData.forEach((item, i) => {
if (item.check) {
cartNmu += 1;
checkedNum += i;
allPrice += parseFloat(item.newprice);
}
})
this.setState({
checkedNum,
allPrice,
cartNmu
})
}
//购买
buy() {
}
deleteAll() {
}
//装载组件
componentDidMount() {
this.getCartList()
}
render() {
return (
<div className="cart-page" style={{ overflow: 'hidden' }}>
<NavBar
style={{ "height": "44px" }}
className="order-tab"
mode="light"
icon={<i style={{"fontSize": '24px'}} className="iconfont iconiconfront-68"></i>}
rightContent={[
<i key="0" style={{ "fontSize": '24px' }} className="iconfont iconiconfront-56"></i>
]}
>
购物车
</NavBar>
<div className="cart-body">
{
this.state.loading ?
<Loading />
:
<CardList />
}
{
this.state.deleteAll ?
<div className="cart-footer">
<div>
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div></div>
<div className={classnames({
'active': this.state.cartNmu > 0
})}
onClick={() => {
if (this.state.cartNmu > 0) {
this.delete()
}
}}>
删除<span>({this.state.cartNmu})</span>
</div>
</div>
:
<div className="cart-footer">
<div className="cart-label">
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div className="all-pirce">
<p>
<span>合计：</span>
<span>￥{this.state.allPrice}</span>
</p>
</div>
<div className={classnames({
'active': this.state.checkedNum > 0
})} onClick={() => {
if (this.state.checkedNum > 0) {
this.buy()
}
}}>
去结算<span>({this.state.checkedNum})</span>
</div>
</div>
}
</div>
</div>
)
}
}
export default connect()(Cart)
\ No newline at end of file
.history/src/components/shopCard/index_20190429101320.js 0 → 100644
import React, { Component } from 'react'
import { connect } from 'react-redux'
import { Checkbox, NavBar } from 'antd-mobile'
//组件
import { ShopCard } from './cardList.js'
import Loading from '@base/Loading'
//css
import './card.scss'
import classnames from 'classnames'
const mockData = [
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
}
]
// function OrderList(props) {
// const listData = props.list;
// return (
// <div style={{"backgroundColor": "#f5f5f5"}}>
// {
// listData.map((item, index) => {
// const Info = (
// <div className="order-info">
// <p className='order-title'>{item.title}</p>
// <p className='order-content'>{item.content}</p>
// <p className='order-des'>
// <span className='order-newprice'>¥{item.newprice}</span>
// <span className='order-price'>¥{item.price}</span>
// </p>
// </div>
// )
// const Tab = (
// <div className="shopcard-check">
// <Checkbox
// checked={item.check}
// onChange={(e) => {
// // this.onChange(e, item.id)
// }}
// />
// </div>
// )
// return (
// <OrderItem {...item} key={index} tab={ Tab } info={Info}>
// </OrderItem>
// )
// })
// }
// </div>
// );
// }
class Cart extends Component {
constructor(props) {
super(props)
this.state = {
deleteAll: false,
loading: false,
checkedNum: 0,
allPrice: 0,
cartNmu: 0,
data: mockData
}
this.checkChange = this.checkChange.bind(this);
}
//获取购物车列表
getCartList() {
}
//全选
allChange(e) {
let checked = e.target.checked
let newData = this.state.data.map((item, i) => {
return {
...item,
check: checked
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//点击
checkChange(id, check) {
let newData = this.state.data.map((item, i) => {
if (item.id === id) {
return {
...item,
check: check
}
} else {
return item;
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//计算总价
calc(newData) {
let allPrice = 0;
let checkedNum = 0;
let cartNmu = 0;
newData.forEach((item, i) => {
if (item.check) {
cartNmu += 1;
checkedNum += i;
allPrice += parseFloat(item.newprice);
}
})
this.setState({
checkedNum,
allPrice,
cartNmu
})
}
//购买
buy() {
}
deleteAll() {
}
//装载组件
componentDidMount() {
this.getCartList()
}
render() {
return (
<div className="cart-page" style={{ overflow: 'hidden' }}>
<NavBar
style={{ "height": "44px" }}
className="order-tab"
mode="light"
icon={<i style={{"fontSize": '24px'}} className="iconfont iconiconfront-68"></i>}
rightContent={[
<i key="0" style={{ "fontSize": '24px' }} className="iconfont iconiconfront-56"></i>
]}
>
购物车
</NavBar>
<div className="cart-body">
{
this.state.loading ?
<Loading />
:
<CardList />
}
{
this.state.deleteAll ?
<div className="cart-footer">
<div>
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div></div>
<div className={classnames({
'active': this.state.cartNmu > 0
})}
onClick={() => {
if (this.state.cartNmu > 0) {
this.delete()
}
}}>
删除<span>({this.state.cartNmu})</span>
</div>
</div>
:
<div className="cart-footer">
<div className="cart-label">
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div className="all-pirce">
<p>
<span>合计：</span>
<span>￥{this.state.allPrice}</span>
</p>
</div>
<div className={classnames({
'active': this.state.checkedNum > 0
})} onClick={() => {
if (this.state.checkedNum > 0) {
this.buy()
}
}}>
去结算<span>({this.state.checkedNum})</span>
</div>
</div>
}
</div>
</div>
)
}
}
export default connect()(Cart)
\ No newline at end of file
.history/src/components/shopCard/index_20190429101326.js 0 → 100644
import React, { Component } from 'react'
import { connect } from 'react-redux'
import { Checkbox, NavBar } from 'antd-mobile'
//组件
import { ShopCard } from './cardList.js'
import Loading from '@base/Loading'
//css
import './card.scss'
import classnames from 'classnames'
const mockData = [
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
}
]
// function OrderList(props) {
// const listData = props.list;
// return (
// <div style={{"backgroundColor": "#f5f5f5"}}>
// {
// listData.map((item, index) => {
// const Info = (
// <div className="order-info">
// <p className='order-title'>{item.title}</p>
// <p className='order-content'>{item.content}</p>
// <p className='order-des'>
// <span className='order-newprice'>¥{item.newprice}</span>
// <span className='order-price'>¥{item.price}</span>
// </p>
// </div>
// )
// const Tab = (
// <div className="shopcard-check">
// <Checkbox
// checked={item.check}
// onChange={(e) => {
// // this.onChange(e, item.id)
// }}
// />
// </div>
// )
// return (
// <OrderItem {...item} key={index} tab={ Tab } info={Info}>
// </OrderItem>
// )
// })
// }
// </div>
// );
// }
class Cart extends Component {
constructor(props) {
super(props)
this.state = {
deleteAll: false,
loading: false,
checkedNum: 0,
allPrice: 0,
cartNmu: 0,
data: mockData
}
this.checkChange = this.checkChange.bind(this);
}
//获取购物车列表
getCartList() {
}
//全选
allChange(e) {
let checked = e.target.checked
let newData = this.state.data.map((item, i) => {
return {
...item,
check: checked
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//点击
checkChange(id, check) {
let newData = this.state.data.map((item, i) => {
if (item.id === id) {
return {
...item,
check: check
}
} else {
return item;
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//计算总价
calc(newData) {
let allPrice = 0;
let checkedNum = 0;
let cartNmu = 0;
newData.forEach((item, i) => {
if (item.check) {
cartNmu += 1;
checkedNum += i;
allPrice += parseFloat(item.newprice);
}
})
this.setState({
checkedNum,
allPrice,
cartNmu
})
}
//购买
buy() {
}
deleteAll() {
}
//装载组件
componentDidMount() {
this.getCartList()
}
render() {
return (
<div className="cart-page" style={{ overflow: 'hidden' }}>
<NavBar
style={{ "height": "44px" }}
className="order-tab"
mode="light"
icon={<i style={{"fontSize": '24px'}} className="iconfont iconiconfront-68"></i>}
rightContent={[
<i key="0" style={{ "fontSize": '24px' }} className="iconfont iconiconfront-56"></i>
]}
>
购物车
</NavBar>
<div className="cart-body">
{
this.state.loading ?
<Loading />
:
<ShopCard />
}
{
this.state.deleteAll ?
<div className="cart-footer">
<div>
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div></div>
<div className={classnames({
'active': this.state.cartNmu > 0
})}
onClick={() => {
if (this.state.cartNmu > 0) {
this.delete()
}
}}>
删除<span>({this.state.cartNmu})</span>
</div>
</div>
:
<div className="cart-footer">
<div className="cart-label">
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div className="all-pirce">
<p>
<span>合计：</span>
<span>￥{this.state.allPrice}</span>
</p>
</div>
<div className={classnames({
'active': this.state.checkedNum > 0
})} onClick={() => {
if (this.state.checkedNum > 0) {
this.buy()
}
}}>
去结算<span>({this.state.checkedNum})</span>
</div>
</div>
}
</div>
</div>
)
}
}
export default connect()(Cart)
\ No newline at end of file
.history/src/components/shopCard/index_20190429101819.js 0 → 100644
import React, { Component } from 'react'
import { connect } from 'react-redux'
import { Checkbox, NavBar } from 'antd-mobile'
//组件
import { ShopCards } from './cardList.js'
import Loading from '@base/Loading'
//css
import './card.scss'
import classnames from 'classnames'
const mockData = [
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
}
]
// function OrderList(props) {
// const listData = props.list;
// return (
// <div style={{"backgroundColor": "#f5f5f5"}}>
// {
// listData.map((item, index) => {
// const Info = (
// <div className="order-info">
// <p className='order-title'>{item.title}</p>
// <p className='order-content'>{item.content}</p>
// <p className='order-des'>
// <span className='order-newprice'>¥{item.newprice}</span>
// <span className='order-price'>¥{item.price}</span>
// </p>
// </div>
// )
// const Tab = (
// <div className="shopcard-check">
// <Checkbox
// checked={item.check}
// onChange={(e) => {
// // this.onChange(e, item.id)
// }}
// />
// </div>
// )
// return (
// <OrderItem {...item} key={index} tab={ Tab } info={Info}>
// </OrderItem>
// )
// })
// }
// </div>
// );
// }
class Cart extends Component {
constructor(props) {
super(props)
this.state = {
deleteAll: false,
loading: false,
checkedNum: 0,
allPrice: 0,
cartNmu: 0,
data: mockData
}
this.checkChange = this.checkChange.bind(this);
}
//获取购物车列表
getCartList() {
}
//全选
allChange(e) {
let checked = e.target.checked
let newData = this.state.data.map((item, i) => {
return {
...item,
check: checked
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//点击
checkChange(id, check) {
let newData = this.state.data.map((item, i) => {
if (item.id === id) {
return {
...item,
check: check
}
} else {
return item;
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//计算总价
calc(newData) {
let allPrice = 0;
let checkedNum = 0;
let cartNmu = 0;
newData.forEach((item, i) => {
if (item.check) {
cartNmu += 1;
checkedNum += i;
allPrice += parseFloat(item.newprice);
}
})
this.setState({
checkedNum,
allPrice,
cartNmu
})
}
//购买
buy() {
}
deleteAll() {
}
//装载组件
componentDidMount() {
this.getCartList()
}
render() {
return (
<div className="cart-page" style={{ overflow: 'hidden' }}>
<NavBar
style={{ "height": "44px" }}
className="order-tab"
mode="light"
icon={<i style={{"fontSize": '24px'}} className="iconfont iconiconfront-68"></i>}
rightContent={[
<i key="0" style={{ "fontSize": '24px' }} className="iconfont iconiconfront-56"></i>
]}
>
购物车
</NavBar>
<div className="cart-body">
{
this.state.loading ?
<Loading />
:
<ShopCards />
}
{
this.state.deleteAll ?
<div className="cart-footer">
<div>
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div></div>
<div className={classnames({
'active': this.state.cartNmu > 0
})}
onClick={() => {
if (this.state.cartNmu > 0) {
this.delete()
}
}}>
删除<span>({this.state.cartNmu})</span>
</div>
</div>
:
<div className="cart-footer">
<div className="cart-label">
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div className="all-pirce">
<p>
<span>合计：</span>
<span>￥{this.state.allPrice}</span>
</p>
</div>
<div className={classnames({
'active': this.state.checkedNum > 0
})} onClick={() => {
if (this.state.checkedNum > 0) {
this.buy()
}
}}>
去结算<span>({this.state.checkedNum})</span>
</div>
</div>
}
</div>
</div>
)
}
}
export default connect()(Cart)
\ No newline at end of file
.history/src/components/shopCard/index_20190429101824.js 0 → 100644
import React, { Component } from 'react'
import { connect } from 'react-redux'
import { Checkbox, NavBar } from 'antd-mobile'
//组件
import { ShopCard } from './cardList.js'
import Loading from '@base/Loading'
//css
import './card.scss'
import classnames from 'classnames'
const mockData = [
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
}
]
// function OrderList(props) {
// const listData = props.list;
// return (
// <div style={{"backgroundColor": "#f5f5f5"}}>
// {
// listData.map((item, index) => {
// const Info = (
// <div className="order-info">
// <p className='order-title'>{item.title}</p>
// <p className='order-content'>{item.content}</p>
// <p className='order-des'>
// <span className='order-newprice'>¥{item.newprice}</span>
// <span className='order-price'>¥{item.price}</span>
// </p>
// </div>
// )
// const Tab = (
// <div className="shopcard-check">
// <Checkbox
// checked={item.check}
// onChange={(e) => {
// // this.onChange(e, item.id)
// }}
// />
// </div>
// )
// return (
// <OrderItem {...item} key={index} tab={ Tab } info={Info}>
// </OrderItem>
// )
// })
// }
// </div>
// );
// }
class Cart extends Component {
constructor(props) {
super(props)
this.state = {
deleteAll: false,
loading: false,
checkedNum: 0,
allPrice: 0,
cartNmu: 0,
data: mockData
}
this.checkChange = this.checkChange.bind(this);
}
//获取购物车列表
getCartList() {
}
//全选
allChange(e) {
let checked = e.target.checked
let newData = this.state.data.map((item, i) => {
return {
...item,
check: checked
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//点击
checkChange(id, check) {
let newData = this.state.data.map((item, i) => {
if (item.id === id) {
return {
...item,
check: check
}
} else {
return item;
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//计算总价
calc(newData) {
let allPrice = 0;
let checkedNum = 0;
let cartNmu = 0;
newData.forEach((item, i) => {
if (item.check) {
cartNmu += 1;
checkedNum += i;
allPrice += parseFloat(item.newprice);
}
})
this.setState({
checkedNum,
allPrice,
cartNmu
})
}
//购买
buy() {
}
deleteAll() {
}
//装载组件
componentDidMount() {
this.getCartList()
}
render() {
return (
<div className="cart-page" style={{ overflow: 'hidden' }}>
<NavBar
style={{ "height": "44px" }}
className="order-tab"
mode="light"
icon={<i style={{"fontSize": '24px'}} className="iconfont iconiconfront-68"></i>}
rightContent={[
<i key="0" style={{ "fontSize": '24px' }} className="iconfont iconiconfront-56"></i>
]}
>
购物车
</NavBar>
<div className="cart-body">
{
this.state.loading ?
<Loading />
:
<ShopCard />
}
{
this.state.deleteAll ?
<div className="cart-footer">
<div>
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div></div>
<div className={classnames({
'active': this.state.cartNmu > 0
})}
onClick={() => {
if (this.state.cartNmu > 0) {
this.delete()
}
}}>
删除<span>({this.state.cartNmu})</span>
</div>
</div>
:
<div className="cart-footer">
<div className="cart-label">
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div className="all-pirce">
<p>
<span>合计：</span>
<span>￥{this.state.allPrice}</span>
</p>
</div>
<div className={classnames({
'active': this.state.checkedNum > 0
})} onClick={() => {
if (this.state.checkedNum > 0) {
this.buy()
}
}}>
去结算<span>({this.state.checkedNum})</span>
</div>
</div>
}
</div>
</div>
)
}
}
export default connect()(Cart)
\ No newline at end of file
.history/src/components/shopCard/index_20190429102238.js 0 → 100644
import React, { Component } from 'react'
import { connect } from 'react-redux'
import { Checkbox, NavBar } from 'antd-mobile'
//组件
import ShopCard from './cardList.js'
import Loading from '@base/Loading'
//css
import './card.scss'
import classnames from 'classnames'
const mockData = [
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
}
]
// function OrderList(props) {
// const listData = props.list;
// return (
// <div style={{"backgroundColor": "#f5f5f5"}}>
// {
// listData.map((item, index) => {
// const Info = (
// <div className="order-info">
// <p className='order-title'>{item.title}</p>
// <p className='order-content'>{item.content}</p>
// <p className='order-des'>
// <span className='order-newprice'>¥{item.newprice}</span>
// <span className='order-price'>¥{item.price}</span>
// </p>
// </div>
// )
// const Tab = (
// <div className="shopcard-check">
// <Checkbox
// checked={item.check}
// onChange={(e) => {
// // this.onChange(e, item.id)
// }}
// />
// </div>
// )
// return (
// <OrderItem {...item} key={index} tab={ Tab } info={Info}>
// </OrderItem>
// )
// })
// }
// </div>
// );
// }
class Cart extends Component {
constructor(props) {
super(props)
this.state = {
deleteAll: false,
loading: false,
checkedNum: 0,
allPrice: 0,
cartNmu: 0,
data: mockData
}
this.checkChange = this.checkChange.bind(this);
}
//获取购物车列表
getCartList() {
}
//全选
allChange(e) {
let checked = e.target.checked
let newData = this.state.data.map((item, i) => {
return {
...item,
check: checked
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//点击
checkChange(id, check) {
let newData = this.state.data.map((item, i) => {
if (item.id === id) {
return {
...item,
check: check
}
} else {
return item;
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//计算总价
calc(newData) {
let allPrice = 0;
let checkedNum = 0;
let cartNmu = 0;
newData.forEach((item, i) => {
if (item.check) {
cartNmu += 1;
checkedNum += i;
allPrice += parseFloat(item.newprice);
}
})
this.setState({
checkedNum,
allPrice,
cartNmu
})
}
//购买
buy() {
}
deleteAll() {
}
//装载组件
componentDidMount() {
this.getCartList()
}
render() {
return (
<div className="cart-page" style={{ overflow: 'hidden' }}>
<NavBar
style={{ "height": "44px" }}
className="order-tab"
mode="light"
icon={<i style={{"fontSize": '24px'}} className="iconfont iconiconfront-68"></i>}
rightContent={[
<i key="0" style={{ "fontSize": '24px' }} className="iconfont iconiconfront-56"></i>
]}
>
购物车
</NavBar>
<div className="cart-body">
{
this.state.loading ?
<Loading />
:
<ShopCard />
}
{
this.state.deleteAll ?
<div className="cart-footer">
<div>
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div></div>
<div className={classnames({
'active': this.state.cartNmu > 0
})}
onClick={() => {
if (this.state.cartNmu > 0) {
this.delete()
}
}}>
删除<span>({this.state.cartNmu})</span>
</div>
</div>
:
<div className="cart-footer">
<div className="cart-label">
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div className="all-pirce">
<p>
<span>合计：</span>
<span>￥{this.state.allPrice}</span>
</p>
</div>
<div className={classnames({
'active': this.state.checkedNum > 0
})} onClick={() => {
if (this.state.checkedNum > 0) {
this.buy()
}
}}>
去结算<span>({this.state.checkedNum})</span>
</div>
</div>
}
</div>
</div>
)
}
}
export default connect()(Cart)
\ No newline at end of file
.history/src/components/shopCard/index_20190429102607.js 0 → 100644
import React, { Component } from 'react'
import { connect } from 'react-redux'
import { Checkbox, NavBar } from 'antd-mobile'
//组件
import ShopCard from './cardList.js'
import Loading from '@base/Loading'
//css
import './card.scss'
import classnames from 'classnames'
const mockData = [
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
}
]
// function OrderList(props) {
// const listData = props.list;
// return (
// <div style={{"backgroundColor": "#f5f5f5"}}>
// {
// listData.map((item, index) => {
// const Info = (
// <div className="order-info">
// <p className='order-title'>{item.title}</p>
// <p className='order-content'>{item.content}</p>
// <p className='order-des'>
// <span className='order-newprice'>¥{item.newprice}</span>
// <span className='order-price'>¥{item.price}</span>
// </p>
// </div>
// )
// const Tab = (
// <div className="shopcard-check">
// <Checkbox
// checked={item.check}
// onChange={(e) => {
// // this.onChange(e, item.id)
// }}
// />
// </div>
// )
// return (
// <OrderItem {...item} key={index} tab={ Tab } info={Info}>
// </OrderItem>
// )
// })
// }
// </div>
// );
// }
class Cart extends Component {
constructor(props) {
super(props)
this.state = {
deleteAll: false,
loading: false,
checkedNum: 0,
allPrice: 0,
cartNmu: 0,
data: mockData
}
this.checkChange = this.checkChange.bind(this);
}
//获取购物车列表
getCartList() {
}
//全选
allChange(e) {
let checked = e.target.checked
let newData = this.state.data.map((item, i) => {
return {
...item,
check: checked
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//点击
checkChange(id, check) {
let newData = this.state.data.map((item, i) => {
if (item.id === id) {
return {
...item,
check: check
}
} else {
return item;
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//计算总价
calc(newData) {
let allPrice = 0;
let checkedNum = 0;
let cartNmu = 0;
newData.forEach((item, i) => {
if (item.check) {
cartNmu += 1;
checkedNum += i;
allPrice += parseFloat(item.newprice);
}
})
this.setState({
checkedNum,
allPrice,
cartNmu
})
}
//购买
buy() {
}
deleteAll() {
}
//装载组件
componentDidMount() {
this.getCartList()
}
render() {
return (
<div className="cart-page" style={{ overflow: 'hidden' }}>
<NavBar
style={{ "height": "44px" }}
className="order-tab"
mode="light"
icon={<i style={{"fontSize": '24px'}} className="iconfont iconiconfront-68"></i>}
rightContent={[
<i key="0" style={{ "fontSize": '24px' }} className="iconfont iconiconfront-56"></i>
]}
>
购物车
</NavBar>
<div className="cart-body">
{
this.state.loading ?
<Loading />
:
<ShopCard data={this.state.data}/>
}
{
this.state.deleteAll ?
<div className="cart-footer">
<div>
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div></div>
<div className={classnames({
'active': this.state.cartNmu > 0
})}
onClick={() => {
if (this.state.cartNmu > 0) {
this.delete()
}
}}>
删除<span>({this.state.cartNmu})</span>
</div>
</div>
:
<div className="cart-footer">
<div className="cart-label">
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div className="all-pirce">
<p>
<span>合计：</span>
<span>￥{this.state.allPrice}</span>
</p>
</div>
<div className={classnames({
'active': this.state.checkedNum > 0
})} onClick={() => {
if (this.state.checkedNum > 0) {
this.buy()
}
}}>
去结算<span>({this.state.checkedNum})</span>
</div>
</div>
}
</div>
</div>
)
}
}
export default connect()(Cart)
\ No newline at end of file
.history/src/components/shopCard/index_20190429102719.js 0 → 100644
import React, { Component } from 'react'
import { connect } from 'react-redux'
import { Checkbox, NavBar } from 'antd-mobile'
//组件
import ShopCard from './cardList.js'
import Loading from '@base/Loading'
//css
import './card.scss'
import classnames from 'classnames'
const mockData = [
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
}
]
function OrderList(props) {
const listData = props.list;
return (
<div style={{"backgroundColor": "#f5f5f5"}}>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
const Tab = (
<div className="shopcard-check">
<Checkbox
checked={item.check}
onChange={(e) => {
// this.onChange(e, item.id)
}}
/>
</div>
)
return (
<OrderItem {...item} key={index} tab={ Tab } info={Info}>
</OrderItem>
)
})
}
</div>
);
}
class Cart extends Component {
constructor(props) {
super(props)
this.state = {
deleteAll: false,
loading: false,
checkedNum: 0,
allPrice: 0,
cartNmu: 0,
data: mockData
}
this.checkChange = this.checkChange.bind(this);
}
//获取购物车列表
getCartList() {
}
//全选
allChange(e) {
let checked = e.target.checked
let newData = this.state.data.map((item, i) => {
return {
...item,
check: checked
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//点击
checkChange(id, check) {
let newData = this.state.data.map((item, i) => {
if (item.id === id) {
return {
...item,
check: check
}
} else {
return item;
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//计算总价
calc(newData) {
let allPrice = 0;
let checkedNum = 0;
let cartNmu = 0;
newData.forEach((item, i) => {
if (item.check) {
cartNmu += 1;
checkedNum += i;
allPrice += parseFloat(item.newprice);
}
})
this.setState({
checkedNum,
allPrice,
cartNmu
})
}
//购买
buy() {
}
deleteAll() {
}
//装载组件
componentDidMount() {
this.getCartList()
}
render() {
return (
<div className="cart-page" style={{ overflow: 'hidden' }}>
<NavBar
style={{ "height": "44px" }}
className="order-tab"
mode="light"
icon={<i style={{"fontSize": '24px'}} className="iconfont iconiconfront-68"></i>}
rightContent={[
<i key="0" style={{ "fontSize": '24px' }} className="iconfont iconiconfront-56"></i>
]}
>
购物车
</NavBar>
<div className="cart-body">
{
this.state.loading ?
<Loading />
:
<ShopCard data={this.state.data}/>
}
{
this.state.deleteAll ?
<div className="cart-footer">
<div>
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div></div>
<div className={classnames({
'active': this.state.cartNmu > 0
})}
onClick={() => {
if (this.state.cartNmu > 0) {
this.delete()
}
}}>
删除<span>({this.state.cartNmu})</span>
</div>
</div>
:
<div className="cart-footer">
<div className="cart-label">
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div className="all-pirce">
<p>
<span>合计：</span>
<span>￥{this.state.allPrice}</span>
</p>
</div>
<div className={classnames({
'active': this.state.checkedNum > 0
})} onClick={() => {
if (this.state.checkedNum > 0) {
this.buy()
}
}}>
去结算<span>({this.state.checkedNum})</span>
</div>
</div>
}
</div>
</div>
)
}
}
export default connect()(Cart)
\ No newline at end of file
.history/src/components/shopCard/index_20190429103059.js 0 → 100644
import React, { Component } from 'react'
import { connect } from 'react-redux'
import { Checkbox, NavBar } from 'antd-mobile'
//组件
import ShopCard from './cardList.js'
import Loading from '@base/Loading'
//css
import './card.scss'
import classnames from 'classnames'
const mockData = [
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
}
]
function OrderList(props) {
const listData = props.list;
return (
<div style={{"backgroundColor": "#f5f5f5"}}>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
const Tab = (
<div className="shopcard-check">
<Checkbox
checked={item.check}
onChange={(e) => {
// this.onChange(e, item.id)
}}
/>
</div>
)
return (
// <OrderItem {...item} key={index} tab={ Tab } info={Info}>
// </OrderItem>
)
})
}
</div>
);
}
class Cart extends Component {
constructor(props) {
super(props)
this.state = {
deleteAll: false,
loading: false,
checkedNum: 0,
allPrice: 0,
cartNmu: 0,
data: mockData
}
this.checkChange = this.checkChange.bind(this);
}
//获取购物车列表
getCartList() {
}
//全选
allChange(e) {
let checked = e.target.checked
let newData = this.state.data.map((item, i) => {
return {
...item,
check: checked
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//点击
checkChange(id, check) {
let newData = this.state.data.map((item, i) => {
if (item.id === id) {
return {
...item,
check: check
}
} else {
return item;
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//计算总价
calc(newData) {
let allPrice = 0;
let checkedNum = 0;
let cartNmu = 0;
newData.forEach((item, i) => {
if (item.check) {
cartNmu += 1;
checkedNum += i;
allPrice += parseFloat(item.newprice);
}
})
this.setState({
checkedNum,
allPrice,
cartNmu
})
}
//购买
buy() {
}
deleteAll() {
}
//装载组件
componentDidMount() {
this.getCartList()
}
render() {
return (
<div className="cart-page" style={{ overflow: 'hidden' }}>
<NavBar
style={{ "height": "44px" }}
className="order-tab"
mode="light"
icon={<i style={{"fontSize": '24px'}} className="iconfont iconiconfront-68"></i>}
rightContent={[
<i key="0" style={{ "fontSize": '24px' }} className="iconfont iconiconfront-56"></i>
]}
>
购物车
</NavBar>
<div className="cart-body">
{
this.state.loading ?
<Loading />
:
<ShopCard data={this.state.data}/>
}
{
this.state.deleteAll ?
<div className="cart-footer">
<div>
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div></div>
<div className={classnames({
'active': this.state.cartNmu > 0
})}
onClick={() => {
if (this.state.cartNmu > 0) {
this.delete()
}
}}>
删除<span>({this.state.cartNmu})</span>
</div>
</div>
:
<div className="cart-footer">
<div className="cart-label">
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div className="all-pirce">
<p>
<span>合计：</span>
<span>￥{this.state.allPrice}</span>
</p>
</div>
<div className={classnames({
'active': this.state.checkedNum > 0
})} onClick={() => {
if (this.state.checkedNum > 0) {
this.buy()
}
}}>
去结算<span>({this.state.checkedNum})</span>
</div>
</div>
}
</div>
</div>
)
}
}
export default connect()(Cart)
\ No newline at end of file
.history/src/components/shopCard/index_20190429103115.js 0 → 100644
import React, { Component } from 'react'
import { connect } from 'react-redux'
import { Checkbox, NavBar } from 'antd-mobile'
//组件
import ShopCard from './cardList.js'
import Loading from '@base/Loading'
//css
import './card.scss'
import classnames from 'classnames'
const mockData = [
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
}
]
class Cart extends Component {
constructor(props) {
super(props)
this.state = {
deleteAll: false,
loading: false,
checkedNum: 0,
allPrice: 0,
cartNmu: 0,
data: mockData
}
this.checkChange = this.checkChange.bind(this);
}
//获取购物车列表
getCartList() {
}
//全选
allChange(e) {
let checked = e.target.checked
let newData = this.state.data.map((item, i) => {
return {
...item,
check: checked
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//点击
checkChange(id, check) {
let newData = this.state.data.map((item, i) => {
if (item.id === id) {
return {
...item,
check: check
}
} else {
return item;
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//计算总价
calc(newData) {
let allPrice = 0;
let checkedNum = 0;
let cartNmu = 0;
newData.forEach((item, i) => {
if (item.check) {
cartNmu += 1;
checkedNum += i;
allPrice += parseFloat(item.newprice);
}
})
this.setState({
checkedNum,
allPrice,
cartNmu
})
}
//购买
buy() {
}
deleteAll() {
}
//装载组件
componentDidMount() {
this.getCartList()
}
render() {
return (
<div className="cart-page" style={{ overflow: 'hidden' }}>
<NavBar
style={{ "height": "44px" }}
className="order-tab"
mode="light"
icon={<i style={{"fontSize": '24px'}} className="iconfont iconiconfront-68"></i>}
rightContent={[
<i key="0" style={{ "fontSize": '24px' }} className="iconfont iconiconfront-56"></i>
]}
>
购物车
</NavBar>
<div className="cart-body">
{
this.state.loading ?
<Loading />
:
<ShopCard data={this.state.data}/>
}
{
this.state.deleteAll ?
<div className="cart-footer">
<div>
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div></div>
<div className={classnames({
'active': this.state.cartNmu > 0
})}
onClick={() => {
if (this.state.cartNmu > 0) {
this.delete()
}
}}>
删除<span>({this.state.cartNmu})</span>
</div>
</div>
:
<div className="cart-footer">
<div className="cart-label">
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div className="all-pirce">
<p>
<span>合计：</span>
<span>￥{this.state.allPrice}</span>
</p>
</div>
<div className={classnames({
'active': this.state.checkedNum > 0
})} onClick={() => {
if (this.state.checkedNum > 0) {
this.buy()
}
}}>
去结算<span>({this.state.checkedNum})</span>
</div>
</div>
}
</div>
</div>
)
}
}
export default connect()(Cart)
\ No newline at end of file
.history/src/components/shopCard/index_20190429105048.js 0 → 100644
import React, { Component } from 'react'
import { connect } from 'react-redux'
import { Checkbox, NavBar } from 'antd-mobile'
//组件
import ShopCard from './cardList.js'
import Loading from '@base/Loading'
//css
import './card.scss'
import classnames from 'classnames'
const mockData = [
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
}
]
class Cart extends Component {
constructor(props) {
super(props)
this.state = {
deleteAll: false,
loading: false,
checkedNum: 0,
allPrice: 0,
cartNmu: 0,
data: mockData
}
this.checkChange = this.checkChange.bind(this);
this.getCartList = this.getCartList.bind(this);
this.changeStock = this.changeStock.bind(this);
}
//获取购物车列表
getCartList() {
}
//全选
allChange(e) {
let checked = e.target.checked
let newData = this.state.data.map((item, i) => {
return {
...item,
check: checked
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//点击
checkChange(id, check) {
let newData = this.state.data.map((item, i) => {
if (item.id === id) {
return {
...item,
check: check
}
} else {
return item;
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//计算总价
calc(newData) {
let allPrice = 0;
let checkedNum = 0;
let cartNmu = 0;
newData.forEach((item, i) => {
if (item.check) {
cartNmu += 1;
checkedNum += i;
allPrice += parseFloat(item.newprice);
}
})
this.setState({
checkedNum,
allPrice,
cartNmu
})
}
//购买
buy() {
}
deleteAll() {
}
//装载组件
componentDidMount() {
this.getCartList()
}
render() {
return (
<div className="cart-page" style={{ overflow: 'hidden' }}>
<NavBar
style={{ "height": "44px" }}
className="order-tab"
mode="light"
icon={<i style={{"fontSize": '24px'}} className="iconfont iconiconfront-68"></i>}
rightContent={[
<i key="0" style={{ "fontSize": '24px' }} className="iconfont iconiconfront-56"></i>
]}
>
购物车
</NavBar>
<div className="cart-body">
{
this.state.loading ?
<Loading />
:
<ShopCard getCartList={this.getCartList.bind(this)} changeStock={this.changeStock.bind(this)} checkChange={this.checkChange.bind(this)} data={this.state.data}/>
}
{
this.state.deleteAll ?
<div className="cart-footer">
<div>
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div></div>
<div className={classnames({
'active': this.state.cartNmu > 0
})}
onClick={() => {
if (this.state.cartNmu > 0) {
this.delete()
}
}}>
删除<span>({this.state.cartNmu})</span>
</div>
</div>
:
<div className="cart-footer">
<div className="cart-label">
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div className="all-pirce">
<p>
<span>合计：</span>
<span>￥{this.state.allPrice}</span>
</p>
</div>
<div className={classnames({
'active': this.state.checkedNum > 0
})} onClick={() => {
if (this.state.checkedNum > 0) {
this.buy()
}
}}>
去结算<span>({this.state.checkedNum})</span>
</div>
</div>
}
</div>
</div>
)
}
}
export default connect()(Cart)
\ No newline at end of file
.history/src/components/shopCard/index_20190429105104.js 0 → 100644
import React, { Component } from 'react'
import { connect } from 'react-redux'
import { Checkbox, NavBar } from 'antd-mobile'
//组件
import ShopCard from './cardList.js'
import Loading from '@base/Loading'
//css
import './card.scss'
import classnames from 'classnames'
const mockData = [
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
}
]
class Cart extends Component {
constructor(props) {
super(props)
this.state = {
deleteAll: false,
loading: false,
checkedNum: 0,
allPrice: 0,
cartNmu: 0,
data: mockData
}
this.checkChange = this.checkChange.bind(this);
this.getCartList = this.getCartList.bind(this);
this.changeStock = this.changeStock.bind(this);
}
//获取购物车列表
getCartList() {
}
//全选
allChange(e) {
let checked = e.target.checked
let newData = this.state.data.map((item, i) => {
return {
...item,
check: checked
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//点击
checkChange(id, check) {
let newData = this.state.data.map((item, i) => {
if (item.id === id) {
return {
...item,
check: check
}
} else {
return item;
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//计算总价
calc(newData) {
let allPrice = 0;
let checkedNum = 0;
let cartNmu = 0;
newData.forEach((item, i) => {
if (item.check) {
cartNmu += 1;
checkedNum += i;
allPrice += parseFloat(item.newprice);
}
})
this.setState({
checkedNum,
allPrice,
cartNmu
})
}
//购买
buy() {
}
deleteAll() {
}
//装载组件
componentDidMount() {
this.getCartList()
}
render() {
return (
<div className="cart-page" style={{ overflow: 'hidden' }}>
<NavBar
style={{ "height": "44px" }}
className="order-tab"
mode="light"
icon={<i style={{"fontSize": '24px'}} className="iconfont iconiconfront-68"></i>}
rightContent={[
<i key="0" style={{ "fontSize": '24px' }} className="iconfont iconiconfront-56"></i>
]}
>
购物车
</NavBar>
<div className="cart-body">
{
this.state.loading ?
<Loading />
:
<ShopCard getCartList={this.getCartList} changeStock={this.changeStock} checkChange={this.checkChange} data={this.state.data}/>
}
{
this.state.deleteAll ?
<div className="cart-footer">
<div>
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div></div>
<div className={classnames({
'active': this.state.cartNmu > 0
})}
onClick={() => {
if (this.state.cartNmu > 0) {
this.delete()
}
}}>
删除<span>({this.state.cartNmu})</span>
</div>
</div>
:
<div className="cart-footer">
<div className="cart-label">
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div className="all-pirce">
<p>
<span>合计：</span>
<span>￥{this.state.allPrice}</span>
</p>
</div>
<div className={classnames({
'active': this.state.checkedNum > 0
})} onClick={() => {
if (this.state.checkedNum > 0) {
this.buy()
}
}}>
去结算<span>({this.state.checkedNum})</span>
</div>
</div>
}
</div>
</div>
)
}
}
export default connect()(Cart)
\ No newline at end of file
.history/src/components/shopCard/index_20190429105200.js 0 → 100644
import React, { Component } from 'react'
import { connect } from 'react-redux'
import { Checkbox, NavBar } from 'antd-mobile'
//组件
import ShopCard from './cardList.js'
import Loading from '@base/Loading'
//css
import './card.scss'
import classnames from 'classnames'
const mockData = [
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
}
]
class Cart extends Component {
constructor(props) {
super(props)
this.state = {
deleteAll: false,
loading: false,
checkedNum: 0,
allPrice: 0,
cartNmu: 0,
data: mockData
}
this.checkChange = this.checkChange.bind(this);
this.getCartList = this.getCartList.bind(this);
this.changeStock = this.changeStock.bind(this);
}
//获取购物车列表
getCartList() {
}
//全选
allChange(e) {
let checked = e.target.checked
let newData = this.state.data.map((item, i) => {
return {
...item,
check: checked
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//点击
checkChange(id, check) {
let newData = this.state.data.map((item, i) => {
if (item.id === id) {
return {
...item,
check: check
}
} else {
return item;
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//计算总价
calc(newData) {
let allPrice = 0;
let checkedNum = 0;
let cartNmu = 0;
newData.forEach((item, i) => {
if (item.check) {
cartNmu += 1;
checkedNum += i;
allPrice += parseFloat(item.newprice);
}
})
this.setState({
checkedNum,
allPrice,
cartNmu
})
}
//购买
buy() {
}
deleteAll() {
}
//装载组件
componentDidMount() {
this.getCartList()
}
render() {
return (
<div className="cart-page" style={{ overflow: 'hidden' }}>
<NavBar
style={{ "height": "44px" }}
className="order-tab"
mode="light"
icon={<i style={{"fontSize": '24px'}} className="iconfont iconiconfront-68"></i>}
rightContent={[
<i key="0" style={{ "fontSize": '24px' }} className="iconfont iconiconfront-56"></i>
]}
>
购物车
</NavBar>
<div className="cart-body">
{
this.state.loading ?
<Loading />
:
<ShopCard getCartList={this.getCartList} changeStock={this.changeStock} checkChange={this.checkChange} data={this.state.data}/>
}
{
this.state.deleteAll ?
<div className="cart-footer">
<div>
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div></div>
<div className={classnames({
'active': this.state.cartNmu > 0
})}
onClick={() => {
if (this.state.cartNmu > 0) {
this.delete()
}
}}>
删除<span>({this.state.cartNmu})</span>
</div>
</div>
:
<div className="cart-footer">
<div className="cart-label">
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div className="all-pirce">
<p>
<span>合计：</span>
<span>￥{this.state.allPrice}</span>
</p>
</div>
<div className={classnames({
'active': this.state.checkedNum > 0
})} onClick={() => {
if (this.state.checkedNum > 0) {
this.buy()
}
}}>
去结算<span>({this.state.checkedNum})</span>
</div>
</div>
}
</div>
</div>
)
}
}
export default connect()(Cart)
\ No newline at end of file
.history/src/components/shopCard/index_20190429105253.js 0 → 100644
import React, { Component } from 'react'
import { connect } from 'react-redux'
import { Checkbox, NavBar } from 'antd-mobile'
//组件
import ShopCard from './cardList.js'
import Loading from '@base/Loading'
//css
import './card.scss'
import classnames from 'classnames'
const mockData = [
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
}
]
class Cart extends Component {
constructor(props) {
super(props)
this.state = {
deleteAll: false,
loading: false,
checkedNum: 0,
allPrice: 0,
cartNmu: 0,
data: mockData
}
this.checkChange = this.checkChange.bind(this);
this.getCartList = this.getCartList.bind(this);
this.changeStock = this.changeStock.bind(this);
}
//获取购物车列表
getCartList() {
}
//全选
allChange(e) {
let checked = e.target.checked
let newData = this.state.data.map((item, i) => {
return {
...item,
check: checked
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//点击
checkChange(id, check) {
let newData = this.state.data.map((item, i) => {
if (item.id === id) {
return {
...item,
check: check
}
} else {
return item;
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//计算总价
calc(newData) {
let allPrice = 0;
let checkedNum = 0;
let cartNmu = 0;
newData.forEach((item, i) => {
if (item.check) {
cartNmu += 1;
checkedNum += i;
allPrice += parseFloat(item.newprice);
}
})
this.setState({
checkedNum,
allPrice,
cartNmu
})
}
//购买
buy() {
}
deleteAll() {
}
//装载组件
componentDidMount() {
this.getCartList()
}
render() {
return (
<div className="cart-page" style={{ overflow: 'hidden' }}>
<NavBar
style={{ "height": "44px" }}
className="order-tab"
mode="light"
icon={<i style={{"fontSize": '24px'}} className="iconfont iconiconfront-68"></i>}
rightContent={[
<i key="0" style={{ "fontSize": '24px' }} className="iconfont iconiconfront-56"></i>
]}
>
购物车
</NavBar>
<div className="cart-body">
{
this.state.loading ?
<Loading />
:
<ShopCard getCartList={this.getCartList} changeStock={this.changeStock} checkChange={this.checkChange} data={this.state.data}/>
}
{
this.state.deleteAll ?
<div className="cart-footer">
<div>
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div></div>
<div className={classnames({
'active': this.state.cartNmu > 0
})}
onClick={() => {
if (this.state.cartNmu > 0) {
this.delete()
}
}}>
删除<span>({this.state.cartNmu})</span>
</div>
</div>
:
<div className="cart-footer">
<div className="cart-label">
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div className="all-pirce">
<p>
<span>合计：</span>
<span>￥{this.state.allPrice}</span>
</p>
</div>
<div className={classnames({
'active': this.state.checkedNum > 0
})} onClick={() => {
if (this.state.checkedNum > 0) {
this.buy()
}
}}>
去结算<span>({this.state.checkedNum})</span>
</div>
</div>
}
</div>
</div>
)
}
}
export default connect()(Cart)
\ No newline at end of file
.history/src/components/shopCard/index_20190429105323.js 0 → 100644
import React, { Component } from 'react'
import { connect } from 'react-redux'
import { Checkbox, NavBar } from 'antd-mobile'
//组件
import ShopCard from './cardList.js'
import Loading from '@base/Loading'
//css
import './card.scss'
import classnames from 'classnames'
const mockData = [
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
}
]
class Cart extends Component {
constructor(props) {
super(props)
this.state = {
deleteAll: false,
loading: false,
checkedNum: 0,
allPrice: 0,
cartNmu: 0,
data: mockData
}
this.checkChange = this.checkChange.bind(this);
this.getCartList = this.getCartList.bind(this);
this.changeStock = this.changeStock.bind(this);
}
//获取购物车列表
getCartList() {
}
changeStock() {
}
//全选
allChange(e) {
let checked = e.target.checked
let newData = this.state.data.map((item, i) => {
return {
...item,
check: checked
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//点击
checkChange(id, check) {
let newData = this.state.data.map((item, i) => {
if (item.id === id) {
return {
...item,
check: check
}
} else {
return item;
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//计算总价
calc(newData) {
let allPrice = 0;
let checkedNum = 0;
let cartNmu = 0;
newData.forEach((item, i) => {
if (item.check) {
cartNmu += 1;
checkedNum += i;
allPrice += parseFloat(item.newprice);
}
})
this.setState({
checkedNum,
allPrice,
cartNmu
})
}
//购买
buy() {
}
deleteAll() {
}
//装载组件
componentDidMount() {
this.getCartList()
}
render() {
return (
<div className="cart-page" style={{ overflow: 'hidden' }}>
<NavBar
style={{ "height": "44px" }}
className="order-tab"
mode="light"
icon={<i style={{"fontSize": '24px'}} className="iconfont iconiconfront-68"></i>}
rightContent={[
<i key="0" style={{ "fontSize": '24px' }} className="iconfont iconiconfront-56"></i>
]}
>
购物车
</NavBar>
<div className="cart-body">
{
this.state.loading ?
<Loading />
:
<ShopCard getCartList={this.getCartList} changeStock={this.changeStock} checkChange={this.checkChange} data={this.state.data}/>
}
{
this.state.deleteAll ?
<div className="cart-footer">
<div>
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div></div>
<div className={classnames({
'active': this.state.cartNmu > 0
})}
onClick={() => {
if (this.state.cartNmu > 0) {
this.delete()
}
}}>
删除<span>({this.state.cartNmu})</span>
</div>
</div>
:
<div className="cart-footer">
<div className="cart-label">
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div className="all-pirce">
<p>
<span>合计：</span>
<span>￥{this.state.allPrice}</span>
</p>
</div>
<div className={classnames({
'active': this.state.checkedNum > 0
})} onClick={() => {
if (this.state.checkedNum > 0) {
this.buy()
}
}}>
去结算<span>({this.state.checkedNum})</span>
</div>
</div>
}
</div>
</div>
)
}
}
export default connect()(Cart)
\ No newline at end of file
.history/src/components/shopCard/index_20190429105633.js 0 → 100644
import React, { Component } from 'react'
import { connect } from 'react-redux'
import { Checkbox, NavBar } from 'antd-mobile'
//组件
import ShopCard from './cardList.js'
import Loading from '@base/Loading'
//css
import './card.scss'
import classnames from 'classnames'
const mockData = [
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
}
]
class Cart extends Component {
constructor(props) {
super(props)
this.state = {
deleteAll: false,
loading: false,
checkedNum: 0,
allPrice: 0,
cartNmu: 0,
data: mockData
}
this.checkChange = this.checkChange.bind(this);
this.getCartList = this.getCartList.bind(this);
this.changeStock = this.changeStock.bind(this);
}
//获取购物车列表
getCartList() {
}
changeStock() {
}
//全选
allChange(e) {
let checked = e.target.checked
let newData = this.state.data.map((item, i) => {
return {
...item,
check: checked
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//点击
checkChange(id, check) {
let newData = this.state.data.map((item, i) => {
console.log(item);
if (item.id === id) {
return {
...item,
check: check
}
} else {
return item;
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//计算总价
calc(newData) {
let allPrice = 0;
let checkedNum = 0;
let cartNmu = 0;
newData.forEach((item, i) => {
if (item.check) {
cartNmu += 1;
checkedNum += i;
allPrice += parseFloat(item.newprice);
}
})
this.setState({
checkedNum,
allPrice,
cartNmu
})
}
//购买
buy() {
}
deleteAll() {
}
//装载组件
componentDidMount() {
this.getCartList()
}
render() {
return (
<div className="cart-page" style={{ overflow: 'hidden' }}>
<NavBar
style={{ "height": "44px" }}
className="order-tab"
mode="light"
icon={<i style={{"fontSize": '24px'}} className="iconfont iconiconfront-68"></i>}
rightContent={[
<i key="0" style={{ "fontSize": '24px' }} className="iconfont iconiconfront-56"></i>
]}
>
购物车
</NavBar>
<div className="cart-body">
{
this.state.loading ?
<Loading />
:
<ShopCard getCartList={this.getCartList} changeStock={this.changeStock} checkChange={this.checkChange} data={this.state.data}/>
}
{
this.state.deleteAll ?
<div className="cart-footer">
<div>
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div></div>
<div className={classnames({
'active': this.state.cartNmu > 0
})}
onClick={() => {
if (this.state.cartNmu > 0) {
this.delete()
}
}}>
删除<span>({this.state.cartNmu})</span>
</div>
</div>
:
<div className="cart-footer">
<div className="cart-label">
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div className="all-pirce">
<p>
<span>合计：</span>
<span>￥{this.state.allPrice}</span>
</p>
</div>
<div className={classnames({
'active': this.state.checkedNum > 0
})} onClick={() => {
if (this.state.checkedNum > 0) {
this.buy()
}
}}>
去结算<span>({this.state.checkedNum})</span>
</div>
</div>
}
</div>
</div>
)
}
}
export default connect()(Cart)
\ No newline at end of file
.history/src/components/shopCard/index_20190429105652.js 0 → 100644
import React, { Component } from 'react'
import { connect } from 'react-redux'
import { Checkbox, NavBar } from 'antd-mobile'
//组件
import ShopCard from './cardList.js'
import Loading from '@base/Loading'
//css
import './card.scss'
import classnames from 'classnames'
const mockData = [
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
}
]
class Cart extends Component {
constructor(props) {
super(props)
this.state = {
deleteAll: false,
loading: false,
checkedNum: 0,
allPrice: 0,
cartNmu: 0,
data: mockData
}
this.checkChange = this.checkChange.bind(this);
this.getCartList = this.getCartList.bind(this);
this.changeStock = this.changeStock.bind(this);
}
//获取购物车列表
getCartList() {
}
changeStock() {
}
//全选
allChange(e) {
let checked = e.target.checked
let newData = this.state.data.map((item, i) => {
return {
...item,
check: checked
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//点击
checkChange(id, check) {
let newData = this.state.data.map((item, i) => {
console.log(item.id);
console.log(id);
if (item.id === id) {
return {
...item,
check: check
}
} else {
return item;
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//计算总价
calc(newData) {
let allPrice = 0;
let checkedNum = 0;
let cartNmu = 0;
newData.forEach((item, i) => {
if (item.check) {
cartNmu += 1;
checkedNum += i;
allPrice += parseFloat(item.newprice);
}
})
this.setState({
checkedNum,
allPrice,
cartNmu
})
}
//购买
buy() {
}
deleteAll() {
}
//装载组件
componentDidMount() {
this.getCartList()
}
render() {
return (
<div className="cart-page" style={{ overflow: 'hidden' }}>
<NavBar
style={{ "height": "44px" }}
className="order-tab"
mode="light"
icon={<i style={{"fontSize": '24px'}} className="iconfont iconiconfront-68"></i>}
rightContent={[
<i key="0" style={{ "fontSize": '24px' }} className="iconfont iconiconfront-56"></i>
]}
>
购物车
</NavBar>
<div className="cart-body">
{
this.state.loading ?
<Loading />
:
<ShopCard getCartList={this.getCartList} changeStock={this.changeStock} checkChange={this.checkChange} data={this.state.data}/>
}
{
this.state.deleteAll ?
<div className="cart-footer">
<div>
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div></div>
<div className={classnames({
'active': this.state.cartNmu > 0
})}
onClick={() => {
if (this.state.cartNmu > 0) {
this.delete()
}
}}>
删除<span>({this.state.cartNmu})</span>
</div>
</div>
:
<div className="cart-footer">
<div className="cart-label">
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div className="all-pirce">
<p>
<span>合计：</span>
<span>￥{this.state.allPrice}</span>
</p>
</div>
<div className={classnames({
'active': this.state.checkedNum > 0
})} onClick={() => {
if (this.state.checkedNum > 0) {
this.buy()
}
}}>
去结算<span>({this.state.checkedNum})</span>
</div>
</div>
}
</div>
</div>
)
}
}
export default connect()(Cart)
\ No newline at end of file
.history/src/components/shopCard/index_20190429105716.js 0 → 100644
import React, { Component } from 'react'
import { connect } from 'react-redux'
import { Checkbox, NavBar } from 'antd-mobile'
//组件
import ShopCard from './cardList.js'
import Loading from '@base/Loading'
//css
import './card.scss'
import classnames from 'classnames'
const mockData = [
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '111',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '112',
check: false
}
]
class Cart extends Component {
constructor(props) {
super(props)
this.state = {
deleteAll: false,
loading: false,
checkedNum: 0,
allPrice: 0,
cartNmu: 0,
data: mockData
}
this.checkChange = this.checkChange.bind(this);
this.getCartList = this.getCartList.bind(this);
this.changeStock = this.changeStock.bind(this);
}
//获取购物车列表
getCartList() {
}
changeStock() {
}
//全选
allChange(e) {
let checked = e.target.checked
let newData = this.state.data.map((item, i) => {
return {
...item,
check: checked
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//点击
checkChange(id, check) {
let newData = this.state.data.map((item, i) => {
console.log(item.id);
console.log(id);
if (item.id === id) {
return {
...item,
check: check
}
} else {
return item;
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//计算总价
calc(newData) {
let allPrice = 0;
let checkedNum = 0;
let cartNmu = 0;
newData.forEach((item, i) => {
if (item.check) {
cartNmu += 1;
checkedNum += i;
allPrice += parseFloat(item.newprice);
}
})
this.setState({
checkedNum,
allPrice,
cartNmu
})
}
//购买
buy() {
}
deleteAll() {
}
//装载组件
componentDidMount() {
this.getCartList()
}
render() {
return (
<div className="cart-page" style={{ overflow: 'hidden' }}>
<NavBar
style={{ "height": "44px" }}
className="order-tab"
mode="light"
icon={<i style={{"fontSize": '24px'}} className="iconfont iconiconfront-68"></i>}
rightContent={[
<i key="0" style={{ "fontSize": '24px' }} className="iconfont iconiconfront-56"></i>
]}
>
购物车
</NavBar>
<div className="cart-body">
{
this.state.loading ?
<Loading />
:
<ShopCard getCartList={this.getCartList} changeStock={this.changeStock} checkChange={this.checkChange} data={this.state.data}/>
}
{
this.state.deleteAll ?
<div className="cart-footer">
<div>
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div></div>
<div className={classnames({
'active': this.state.cartNmu > 0
})}
onClick={() => {
if (this.state.cartNmu > 0) {
this.delete()
}
}}>
删除<span>({this.state.cartNmu})</span>
</div>
</div>
:
<div className="cart-footer">
<div className="cart-label">
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div className="all-pirce">
<p>
<span>合计：</span>
<span>￥{this.state.allPrice}</span>
</p>
</div>
<div className={classnames({
'active': this.state.checkedNum > 0
})} onClick={() => {
if (this.state.checkedNum > 0) {
this.buy()
}
}}>
去结算<span>({this.state.checkedNum})</span>
</div>
</div>
}
</div>
</div>
)
}
}
export default connect()(Cart)
\ No newline at end of file
.history/src/components/shopCard/index_20190429111508.js 0 → 100644
import React, { Component } from 'react'
import { connect } from 'react-redux'
import { Checkbox, NavBar } from 'antd-mobile'
//组件
import ShopCard from './cardList.js'
import Loading from '@base/Loading'
//css
import './card.scss'
import classnames from 'classnames'
const mockData = [
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '111',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '112',
check: false
}
]
class Cart extends Component {
constructor(props) {
super(props)
this.state = {
deleteAll: false,
loading: false,
checkedNum: 0,
allPrice: 0,
cartNmu: 0,
data: mockData
}
this.checkChange = this.checkChange.bind(this);
this.getCartList = this.getCartList.bind(this);
this.changeStock = this.changeStock.bind(this);
}
//获取购物车列表
getCartList() {
}
changeStock() {
}
//全选
allChange(e) {
let checked = e.target.checked
let newData = this.state.data.map((item, i) => {
return {
...item,
check: checked
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//点击
checkChange(id, check) {
let newData = this.state.data.map((item, i) => {
console.log(item.id);
console.log(id);
if (item.id === id) {
return {
...item,
check: check
}
} else {
return item;
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//计算总价
calc(newData) {
let allPrice = 0;
let checkedNum = 0;
let cartNmu = 0;
newData.forEach((item, i) => {
console.log(i);
if (item.check) {
cartNmu += 1;
checkedNum += i;
allPrice += parseFloat(item.newprice);
}
})
this.setState({
checkedNum,
allPrice,
cartNmu
})
}
//购买
buy() {
}
deleteAll() {
}
//装载组件
componentDidMount() {
this.getCartList()
}
render() {
return (
<div className="cart-page" style={{ overflow: 'hidden' }}>
<NavBar
style={{ "height": "44px" }}
className="order-tab"
mode="light"
icon={<i style={{"fontSize": '24px'}} className="iconfont iconiconfront-68"></i>}
rightContent={[
<i key="0" style={{ "fontSize": '24px' }} className="iconfont iconiconfront-56"></i>
]}
>
购物车
</NavBar>
<div className="cart-body">
{
this.state.loading ?
<Loading />
:
<ShopCard getCartList={this.getCartList} changeStock={this.changeStock} checkChange={this.checkChange} data={this.state.data}/>
}
{
this.state.deleteAll ?
<div className="cart-footer">
<div>
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div></div>
<div className={classnames({
'active': this.state.cartNmu > 0
})}
onClick={() => {
if (this.state.cartNmu > 0) {
this.delete()
}
}}>
删除<span>({this.state.cartNmu})</span>
</div>
</div>
:
<div className="cart-footer">
<div className="cart-label">
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div className="all-pirce">
<p>
<span>合计：</span>
<span>￥{this.state.allPrice}</span>
</p>
</div>
<div className={classnames({
'active': this.state.checkedNum > 0
})} onClick={() => {
if (this.state.checkedNum > 0) {
this.buy()
}
}}>
去结算<span>({this.state.checkedNum})</span>
</div>
</div>
}
</div>
</div>
)
}
}
export default connect()(Cart)
\ No newline at end of file
.history/src/components/shopCard/index_20190429111520.js 0 → 100644
import React, { Component } from 'react'
import { connect } from 'react-redux'
import { Checkbox, NavBar } from 'antd-mobile'
//组件
import ShopCard from './cardList.js'
import Loading from '@base/Loading'
//css
import './card.scss'
import classnames from 'classnames'
const mockData = [
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '111',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '112',
check: false
}
]
class Cart extends Component {
constructor(props) {
super(props)
this.state = {
deleteAll: false,
loading: false,
checkedNum: 0,
allPrice: 0,
cartNmu: 0,
data: mockData
}
this.checkChange = this.checkChange.bind(this);
this.getCartList = this.getCartList.bind(this);
this.changeStock = this.changeStock.bind(this);
}
//获取购物车列表
getCartList() {
}
changeStock() {
}
//全选
allChange(e) {
let checked = e.target.checked
let newData = this.state.data.map((item, i) => {
return {
...item,
check: checked
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//点击
checkChange(id, check) {
let newData = this.state.data.map((item, i) => {
console.log(item.id);
console.log(id);
if (item.id === id) {
return {
...item,
check: check
}
} else {
return item;
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//计算总价
calc(newData) {
let allPrice = 0;
let checkedNum = 0;
let cartNmu = 0;
newData.forEach((item, i) => {
if (item.check) {
cartNmu += 1;
checkedNum += i;
allPrice += parseFloat(item.newprice);
}
})
this.setState({
checkedNum,
allPrice,
cartNmu
})
}
//购买
buy() {
}
deleteAll() {
}
//装载组件
componentDidMount() {
this.getCartList()
}
render() {
return (
<div className="cart-page" style={{ overflow: 'hidden' }}>
<NavBar
style={{ "height": "44px" }}
className="order-tab"
mode="light"
icon={<i style={{"fontSize": '24px'}} className="iconfont iconiconfront-68"></i>}
rightContent={[
<i key="0" style={{ "fontSize": '24px' }} className="iconfont iconiconfront-56"></i>
]}
>
购物车
</NavBar>
<div className="cart-body">
{
this.state.loading ?
<Loading />
:
<ShopCard getCartList={this.getCartList} changeStock={this.changeStock} checkChange={this.checkChange} data={this.state.data}/>
}
{
this.state.deleteAll ?
<div className="cart-footer">
<div>
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div></div>
<div className={classnames({
'active': this.state.cartNmu > 0
})}
onClick={() => {
if (this.state.cartNmu > 0) {
this.delete()
}
}}>
删除<span>({this.state.cartNmu})</span>
</div>
</div>
:
<div className="cart-footer">
<div className="cart-label">
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div className="all-pirce">
<p>
<span>合计：</span>
<span>￥{this.state.allPrice}</span>
</p>
</div>
<div className={classnames({
'active': this.state.checkedNum > 0
})} onClick={() => {
if (this.state.checkedNum > 0) {
this.buy()
}
}}>
去结算<span>({this.state.checkedNum})</span>
</div>
</div>
}
</div>
</div>
)
}
}
export default connect()(Cart)
\ No newline at end of file
.history/src/components/shopCard/index_20190429111537.js 0 → 100644
import React, { Component } from 'react'
import { connect } from 'react-redux'
import { Checkbox, NavBar } from 'antd-mobile'
//组件
import ShopCard from './cardList.js'
import Loading from '@base/Loading'
//css
import './card.scss'
import classnames from 'classnames'
const mockData = [
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '111',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '112',
check: false
}
]
class Cart extends Component {
constructor(props) {
super(props)
this.state = {
deleteAll: false,
loading: false,
checkedNum: 0,
allPrice: 0,
cartNmu: 0,
data: mockData
}
this.checkChange = this.checkChange.bind(this);
this.getCartList = this.getCartList.bind(this);
this.changeStock = this.changeStock.bind(this);
}
//获取购物车列表
getCartList() {
}
changeStock() {
}
//全选
allChange(e) {
let checked = e.target.checked
let newData = this.state.data.map((item, i) => {
return {
...item,
check: checked
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//点击
checkChange(id, check) {
let newData = this.state.data.map((item, i) => {
console.log(item.id);
console.log(id);
if (item.id === id) {
return {
...item,
check: check
}
} else {
return item;
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//计算总价
calc(newData) {
let allPrice = 0;
let checkedNum = 0;
let cartNmu = 0;
newData.forEach((item, i) => {
if (item.check) {
cartNmu += 1;
checkedNum += i+1;
allPrice += parseFloat(item.newprice);
}
})
this.setState({
checkedNum,
allPrice,
cartNmu
})
}
//购买
buy() {
}
deleteAll() {
}
//装载组件
componentDidMount() {
this.getCartList()
}
render() {
return (
<div className="cart-page" style={{ overflow: 'hidden' }}>
<NavBar
style={{ "height": "44px" }}
className="order-tab"
mode="light"
icon={<i style={{"fontSize": '24px'}} className="iconfont iconiconfront-68"></i>}
rightContent={[
<i key="0" style={{ "fontSize": '24px' }} className="iconfont iconiconfront-56"></i>
]}
>
购物车
</NavBar>
<div className="cart-body">
{
this.state.loading ?
<Loading />
:
<ShopCard getCartList={this.getCartList} changeStock={this.changeStock} checkChange={this.checkChange} data={this.state.data}/>
}
{
this.state.deleteAll ?
<div className="cart-footer">
<div>
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div></div>
<div className={classnames({
'active': this.state.cartNmu > 0
})}
onClick={() => {
if (this.state.cartNmu > 0) {
this.delete()
}
}}>
删除<span>({this.state.cartNmu})</span>
</div>
</div>
:
<div className="cart-footer">
<div className="cart-label">
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div className="all-pirce">
<p>
<span>合计：</span>
<span>￥{this.state.allPrice}</span>
</p>
</div>
<div className={classnames({
'active': this.state.checkedNum > 0
})} onClick={() => {
if (this.state.checkedNum > 0) {
this.buy()
}
}}>
去结算<span>({this.state.checkedNum})</span>
</div>
</div>
}
</div>
</div>
)
}
}
export default connect()(Cart)
\ No newline at end of file
.history/src/components/shopCard/index_20190429111548.js 0 → 100644
import React, { Component } from 'react'
import { connect } from 'react-redux'
import { Checkbox, NavBar } from 'antd-mobile'
//组件
import ShopCard from './cardList.js'
import Loading from '@base/Loading'
//css
import './card.scss'
import classnames from 'classnames'
const mockData = [
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '111',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '112',
check: false
}
]
class Cart extends Component {
constructor(props) {
super(props)
this.state = {
deleteAll: false,
loading: false,
checkedNum: 0,
allPrice: 0,
cartNmu: 0,
data: mockData
}
this.checkChange = this.checkChange.bind(this);
this.getCartList = this.getCartList.bind(this);
this.changeStock = this.changeStock.bind(this);
}
//获取购物车列表
getCartList() {
}
changeStock() {
}
//全选
allChange(e) {
let checked = e.target.checked
let newData = this.state.data.map((item, i) => {
return {
...item,
check: checked
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//点击
checkChange(id, check) {
let newData = this.state.data.map((item, i) => {
console.log(item.id);
console.log(id);
if (item.id === id) {
return {
...item,
check: check
}
} else {
return item;
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//计算总价
calc(newData) {
let allPrice = 0;
let checkedNum = 0;
let cartNmu = 0;
newData.forEach((item, i) => {
if (item.check) {
cartNmu += 1;
checkedNum += i;
allPrice += parseFloat(item.newprice);
}
})
this.setState({
checkedNum,
allPrice,
cartNmu
})
}
//购买
buy() {
}
deleteAll() {
}
//装载组件
componentDidMount() {
this.getCartList()
}
render() {
return (
<div className="cart-page" style={{ overflow: 'hidden' }}>
<NavBar
style={{ "height": "44px" }}
className="order-tab"
mode="light"
icon={<i style={{"fontSize": '24px'}} className="iconfont iconiconfront-68"></i>}
rightContent={[
<i key="0" style={{ "fontSize": '24px' }} className="iconfont iconiconfront-56"></i>
]}
>
购物车
</NavBar>
<div className="cart-body">
{
this.state.loading ?
<Loading />
:
<ShopCard getCartList={this.getCartList} changeStock={this.changeStock} checkChange={this.checkChange} data={this.state.data}/>
}
{
this.state.deleteAll ?
<div className="cart-footer">
<div>
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div></div>
<div className={classnames({
'active': this.state.cartNmu > 0
})}
onClick={() => {
if (this.state.cartNmu > 0) {
this.delete()
}
}}>
删除<span>({this.state.cartNmu})</span>
</div>
</div>
:
<div className="cart-footer">
<div className="cart-label">
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div className="all-pirce">
<p>
<span>合计：</span>
<span>￥{this.state.allPrice}</span>
</p>
</div>
<div className={classnames({
'active': this.state.checkedNum > 0
})} onClick={() => {
if (this.state.checkedNum > 0) {
this.buy()
}
}}>
去结算<span>({this.state.checkedNum})</span>
</div>
</div>
}
</div>
</div>
)
}
}
export default connect()(Cart)
\ No newline at end of file
.history/src/components/shopCard/index_20190429111624.js 0 → 100644
import React, { Component } from 'react'
import { connect } from 'react-redux'
import { Checkbox, NavBar } from 'antd-mobile'
//组件
import ShopCard from './cardList.js'
import Loading from '@base/Loading'
//css
import './card.scss'
import classnames from 'classnames'
const mockData = [
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '111',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '112',
check: false
}
]
class Cart extends Component {
constructor(props) {
super(props)
this.state = {
deleteAll: false,
loading: false,
checkedNum: 0,
allPrice: 0,
cartNmu: 0,
data: mockData
}
this.checkChange = this.checkChange.bind(this);
this.getCartList = this.getCartList.bind(this);
this.changeStock = this.changeStock.bind(this);
}
//获取购物车列表
getCartList() {
}
changeStock() {
}
//全选
allChange(e) {
let checked = e.target.checked
let newData = this.state.data.map((item, i) => {
return {
...item,
check: checked
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//点击
checkChange(id, check) {
let newData = this.state.data.map((item, i) => {
console.log(item);
console.log(id);
if (item.id === id) {
return {
...item,
check: check
}
} else {
return item;
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//计算总价
calc(newData) {
let allPrice = 0;
let checkedNum = 0;
let cartNmu = 0;
newData.forEach((item, i) => {
if (item.check) {
cartNmu += 1;
checkedNum += i;
allPrice += parseFloat(item.newprice);
}
})
this.setState({
checkedNum,
allPrice,
cartNmu
})
}
//购买
buy() {
}
deleteAll() {
}
//装载组件
componentDidMount() {
this.getCartList()
}
render() {
return (
<div className="cart-page" style={{ overflow: 'hidden' }}>
<NavBar
style={{ "height": "44px" }}
className="order-tab"
mode="light"
icon={<i style={{"fontSize": '24px'}} className="iconfont iconiconfront-68"></i>}
rightContent={[
<i key="0" style={{ "fontSize": '24px' }} className="iconfont iconiconfront-56"></i>
]}
>
购物车
</NavBar>
<div className="cart-body">
{
this.state.loading ?
<Loading />
:
<ShopCard getCartList={this.getCartList} changeStock={this.changeStock} checkChange={this.checkChange} data={this.state.data}/>
}
{
this.state.deleteAll ?
<div className="cart-footer">
<div>
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div></div>
<div className={classnames({
'active': this.state.cartNmu > 0
})}
onClick={() => {
if (this.state.cartNmu > 0) {
this.delete()
}
}}>
删除<span>({this.state.cartNmu})</span>
</div>
</div>
:
<div className="cart-footer">
<div className="cart-label">
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div className="all-pirce">
<p>
<span>合计：</span>
<span>￥{this.state.allPrice}</span>
</p>
</div>
<div className={classnames({
'active': this.state.checkedNum > 0
})} onClick={() => {
if (this.state.checkedNum > 0) {
this.buy()
}
}}>
去结算<span>({this.state.checkedNum})</span>
</div>
</div>
}
</div>
</div>
)
}
}
export default connect()(Cart)
\ No newline at end of file
.history/src/components/shopCard/index_20190429111710.js 0 → 100644
import React, { Component } from 'react'
import { connect } from 'react-redux'
import { Checkbox, NavBar } from 'antd-mobile'
//组件
import ShopCard from './cardList.js'
import Loading from '@base/Loading'
//css
import './card.scss'
import classnames from 'classnames'
const mockData = [
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '111',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '112',
check: false
}
]
class Cart extends Component {
constructor(props) {
super(props)
this.state = {
deleteAll: false,
loading: false,
checkedNum: 0,
allPrice: 0,
cartNmu: 0,
data: mockData
}
this.checkChange = this.checkChange.bind(this);
this.getCartList = this.getCartList.bind(this);
this.changeStock = this.changeStock.bind(this);
}
//获取购物车列表
getCartList() {
}
changeStock() {
}
//全选
allChange(e) {
let checked = e.target.checked
let newData = this.state.data.map((item, i) => {
return {
...item,
check: checked
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//点击
checkChange(id, check) {
let newData = this.state.data.map((item, i) => {
console.log(item);
console.log(id);
if (item.id === id) {
return {
...item,
check: check
}
} else {
return item;
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//计算总价
calc(newData) {
let allPrice = 0;
let checkedNum = 0;
let cartNmu = 0;
newData.forEach((item, i) => {
if (item.check) {
cartNmu += 1;
checkedNum = i++;
allPrice += parseFloat(item.newprice);
}
})
this.setState({
checkedNum,
allPrice,
cartNmu
})
}
//购买
buy() {
}
deleteAll() {
}
//装载组件
componentDidMount() {
this.getCartList()
}
render() {
return (
<div className="cart-page" style={{ overflow: 'hidden' }}>
<NavBar
style={{ "height": "44px" }}
className="order-tab"
mode="light"
icon={<i style={{"fontSize": '24px'}} className="iconfont iconiconfront-68"></i>}
rightContent={[
<i key="0" style={{ "fontSize": '24px' }} className="iconfont iconiconfront-56"></i>
]}
>
购物车
</NavBar>
<div className="cart-body">
{
this.state.loading ?
<Loading />
:
<ShopCard getCartList={this.getCartList} changeStock={this.changeStock} checkChange={this.checkChange} data={this.state.data}/>
}
{
this.state.deleteAll ?
<div className="cart-footer">
<div>
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div></div>
<div className={classnames({
'active': this.state.cartNmu > 0
})}
onClick={() => {
if (this.state.cartNmu > 0) {
this.delete()
}
}}>
删除<span>({this.state.cartNmu})</span>
</div>
</div>
:
<div className="cart-footer">
<div className="cart-label">
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div className="all-pirce">
<p>
<span>合计：</span>
<span>￥{this.state.allPrice}</span>
</p>
</div>
<div className={classnames({
'active': this.state.checkedNum > 0
})} onClick={() => {
if (this.state.checkedNum > 0) {
this.buy()
}
}}>
去结算<span>({this.state.checkedNum})</span>
</div>
</div>
}
</div>
</div>
)
}
}
export default connect()(Cart)
\ No newline at end of file
.history/src/components/shopCard/index_20190429111840.js 0 → 100644
import React, { Component } from 'react'
import { connect } from 'react-redux'
import { Checkbox, NavBar } from 'antd-mobile'
//组件
import ShopCard from './cardList.js'
import Loading from '@base/Loading'
//css
import './card.scss'
import classnames from 'classnames'
const mockData = [
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '111',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '112',
check: false
}
]
class Cart extends Component {
constructor(props) {
super(props)
this.state = {
deleteAll: false,
loading: false,
checkedNum: 0,
allPrice: 0,
cartNmu: 0,
data: mockData
}
this.checkChange = this.checkChange.bind(this);
this.getCartList = this.getCartList.bind(this);
this.changeStock = this.changeStock.bind(this);
}
//获取购物车列表
getCartList() {
}
changeStock() {
}
//全选
allChange(e) {
let checked = e.target.checked
let newData = this.state.data.map((item, i) => {
return {
...item,
check: checked
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//点击
checkChange(id, check) {
let newData = this.state.data.map((item, i) => {
console.log(item);
console.log(id);
if (item.id === id) {
return {
...item,
check: check
}
} else {
return item;
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//计算总价
calc(newData) {
let allPrice = 0;
let checkedNum = 0;
let cartNmu = 0;
newData.forEach((item, i) => {
if (item.check) {
i++；
cartNmu += 1;
checkedNum = i++;
allPrice += parseFloat(item.newprice);
}
})
this.setState({
checkedNum,
allPrice,
cartNmu
})
}
//购买
buy() {
}
deleteAll() {
}
//装载组件
componentDidMount() {
this.getCartList()
}
render() {
return (
<div className="cart-page" style={{ overflow: 'hidden' }}>
<NavBar
style={{ "height": "44px" }}
className="order-tab"
mode="light"
icon={<i style={{"fontSize": '24px'}} className="iconfont iconiconfront-68"></i>}
rightContent={[
<i key="0" style={{ "fontSize": '24px' }} className="iconfont iconiconfront-56"></i>
]}
>
购物车
</NavBar>
<div className="cart-body">
{
this.state.loading ?
<Loading />
:
<ShopCard getCartList={this.getCartList} changeStock={this.changeStock} checkChange={this.checkChange} data={this.state.data}/>
}
{
this.state.deleteAll ?
<div className="cart-footer">
<div>
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div></div>
<div className={classnames({
'active': this.state.cartNmu > 0
})}
onClick={() => {
if (this.state.cartNmu > 0) {
this.delete()
}
}}>
删除<span>({this.state.cartNmu})</span>
</div>
</div>
:
<div className="cart-footer">
<div className="cart-label">
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div className="all-pirce">
<p>
<span>合计：</span>
<span>￥{this.state.allPrice}</span>
</p>
</div>
<div className={classnames({
'active': this.state.checkedNum > 0
})} onClick={() => {
if (this.state.checkedNum > 0) {
this.buy()
}
}}>
去结算<span>({this.state.checkedNum})</span>
</div>
</div>
}
</div>
</div>
)
}
}
export default connect()(Cart)
\ No newline at end of file
.history/src/components/shopCard/index_20190429111843.js 0 → 100644
import React, { Component } from 'react'
import { connect } from 'react-redux'
import { Checkbox, NavBar } from 'antd-mobile'
//组件
import ShopCard from './cardList.js'
import Loading from '@base/Loading'
//css
import './card.scss'
import classnames from 'classnames'
const mockData = [
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '111',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '112',
check: false
}
]
class Cart extends Component {
constructor(props) {
super(props)
this.state = {
deleteAll: false,
loading: false,
checkedNum: 0,
allPrice: 0,
cartNmu: 0,
data: mockData
}
this.checkChange = this.checkChange.bind(this);
this.getCartList = this.getCartList.bind(this);
this.changeStock = this.changeStock.bind(this);
}
//获取购物车列表
getCartList() {
}
changeStock() {
}
//全选
allChange(e) {
let checked = e.target.checked
let newData = this.state.data.map((item, i) => {
return {
...item,
check: checked
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//点击
checkChange(id, check) {
let newData = this.state.data.map((item, i) => {
console.log(item);
console.log(id);
if (item.id === id) {
return {
...item,
check: check
}
} else {
return item;
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//计算总价
calc(newData) {
let allPrice = 0;
let checkedNum = 0;
let cartNmu = 0;
newData.forEach((item, i) => {
if (item.check) {
i++;
cartNmu += 1;
checkedNum = i++;
allPrice += parseFloat(item.newprice);
}
})
this.setState({
checkedNum,
allPrice,
cartNmu
})
}
//购买
buy() {
}
deleteAll() {
}
//装载组件
componentDidMount() {
this.getCartList()
}
render() {
return (
<div className="cart-page" style={{ overflow: 'hidden' }}>
<NavBar
style={{ "height": "44px" }}
className="order-tab"
mode="light"
icon={<i style={{"fontSize": '24px'}} className="iconfont iconiconfront-68"></i>}
rightContent={[
<i key="0" style={{ "fontSize": '24px' }} className="iconfont iconiconfront-56"></i>
]}
>
购物车
</NavBar>
<div className="cart-body">
{
this.state.loading ?
<Loading />
:
<ShopCard getCartList={this.getCartList} changeStock={this.changeStock} checkChange={this.checkChange} data={this.state.data}/>
}
{
this.state.deleteAll ?
<div className="cart-footer">
<div>
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div></div>
<div className={classnames({
'active': this.state.cartNmu > 0
})}
onClick={() => {
if (this.state.cartNmu > 0) {
this.delete()
}
}}>
删除<span>({this.state.cartNmu})</span>
</div>
</div>
:
<div className="cart-footer">
<div className="cart-label">
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div className="all-pirce">
<p>
<span>合计：</span>
<span>￥{this.state.allPrice}</span>
</p>
</div>
<div className={classnames({
'active': this.state.checkedNum > 0
})} onClick={() => {
if (this.state.checkedNum > 0) {
this.buy()
}
}}>
去结算<span>({this.state.checkedNum})</span>
</div>
</div>
}
</div>
</div>
)
}
}
export default connect()(Cart)
\ No newline at end of file
.history/src/components/shopCard/index_20190429111852.js 0 → 100644
import React, { Component } from 'react'
import { connect } from 'react-redux'
import { Checkbox, NavBar } from 'antd-mobile'
//组件
import ShopCard from './cardList.js'
import Loading from '@base/Loading'
//css
import './card.scss'
import classnames from 'classnames'
const mockData = [
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '111',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '112',
check: false
}
]
class Cart extends Component {
constructor(props) {
super(props)
this.state = {
deleteAll: false,
loading: false,
checkedNum: 0,
allPrice: 0,
cartNmu: 0,
data: mockData
}
this.checkChange = this.checkChange.bind(this);
this.getCartList = this.getCartList.bind(this);
this.changeStock = this.changeStock.bind(this);
}
//获取购物车列表
getCartList() {
}
changeStock() {
}
//全选
allChange(e) {
let checked = e.target.checked
let newData = this.state.data.map((item, i) => {
return {
...item,
check: checked
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//点击
checkChange(id, check) {
let newData = this.state.data.map((item, i) => {
console.log(item);
console.log(id);
if (item.id === id) {
return {
...item,
check: check
}
} else {
return item;
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//计算总价
calc(newData) {
let allPrice = 0;
let checkedNum = 0;
let cartNmu = 0;
newData.forEach((item, i) => {
if (item.check) {
i++;
cartNmu += 1;
checkedNum += i;
allPrice += parseFloat(item.newprice);
}
})
this.setState({
checkedNum,
allPrice,
cartNmu
})
}
//购买
buy() {
}
deleteAll() {
}
//装载组件
componentDidMount() {
this.getCartList()
}
render() {
return (
<div className="cart-page" style={{ overflow: 'hidden' }}>
<NavBar
style={{ "height": "44px" }}
className="order-tab"
mode="light"
icon={<i style={{"fontSize": '24px'}} className="iconfont iconiconfront-68"></i>}
rightContent={[
<i key="0" style={{ "fontSize": '24px' }} className="iconfont iconiconfront-56"></i>
]}
>
购物车
</NavBar>
<div className="cart-body">
{
this.state.loading ?
<Loading />
:
<ShopCard getCartList={this.getCartList} changeStock={this.changeStock} checkChange={this.checkChange} data={this.state.data}/>
}
{
this.state.deleteAll ?
<div className="cart-footer">
<div>
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div></div>
<div className={classnames({
'active': this.state.cartNmu > 0
})}
onClick={() => {
if (this.state.cartNmu > 0) {
this.delete()
}
}}>
删除<span>({this.state.cartNmu})</span>
</div>
</div>
:
<div className="cart-footer">
<div className="cart-label">
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div className="all-pirce">
<p>
<span>合计：</span>
<span>￥{this.state.allPrice}</span>
</p>
</div>
<div className={classnames({
'active': this.state.checkedNum > 0
})} onClick={() => {
if (this.state.checkedNum > 0) {
this.buy()
}
}}>
去结算<span>({this.state.checkedNum})</span>
</div>
</div>
}
</div>
</div>
)
}
}
export default connect()(Cart)
\ No newline at end of file
.history/src/components/shopCard/index_20190429111910.js 0 → 100644
import React, { Component } from 'react'
import { connect } from 'react-redux'
import { Checkbox, NavBar } from 'antd-mobile'
//组件
import ShopCard from './cardList.js'
import Loading from '@base/Loading'
//css
import './card.scss'
import classnames from 'classnames'
const mockData = [
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '111',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '112',
check: false
}
]
class Cart extends Component {
constructor(props) {
super(props)
this.state = {
deleteAll: false,
loading: false,
checkedNum: 0,
allPrice: 0,
cartNmu: 0,
data: mockData
}
this.checkChange = this.checkChange.bind(this);
this.getCartList = this.getCartList.bind(this);
this.changeStock = this.changeStock.bind(this);
}
//获取购物车列表
getCartList() {
}
changeStock() {
}
//全选
allChange(e) {
let checked = e.target.checked
let newData = this.state.data.map((item, i) => {
return {
...item,
check: checked
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//点击
checkChange(id, check) {
let newData = this.state.data.map((item, i) => {
console.log(item);
console.log(id);
if (item.id === id) {
return {
...item,
check: check
}
} else {
return item;
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//计算总价
calc(newData) {
let allPrice = 0;
let checkedNum = 0;
let cartNmu = 0;
newData.forEach((item, i) => {
if (item.check) {
i++;
cartNmu += 1;
checkedNum = i;
allPrice += parseFloat(item.newprice);
}
})
this.setState({
checkedNum,
allPrice,
cartNmu
})
}
//购买
buy() {
}
deleteAll() {
}
//装载组件
componentDidMount() {
this.getCartList()
}
render() {
return (
<div className="cart-page" style={{ overflow: 'hidden' }}>
<NavBar
style={{ "height": "44px" }}
className="order-tab"
mode="light"
icon={<i style={{"fontSize": '24px'}} className="iconfont iconiconfront-68"></i>}
rightContent={[
<i key="0" style={{ "fontSize": '24px' }} className="iconfont iconiconfront-56"></i>
]}
>
购物车
</NavBar>
<div className="cart-body">
{
this.state.loading ?
<Loading />
:
<ShopCard getCartList={this.getCartList} changeStock={this.changeStock} checkChange={this.checkChange} data={this.state.data}/>
}
{
this.state.deleteAll ?
<div className="cart-footer">
<div>
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div></div>
<div className={classnames({
'active': this.state.cartNmu > 0
})}
onClick={() => {
if (this.state.cartNmu > 0) {
this.delete()
}
}}>
删除<span>({this.state.cartNmu})</span>
</div>
</div>
:
<div className="cart-footer">
<div className="cart-label">
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div className="all-pirce">
<p>
<span>合计：</span>
<span>￥{this.state.allPrice}</span>
</p>
</div>
<div className={classnames({
'active': this.state.checkedNum > 0
})} onClick={() => {
if (this.state.checkedNum > 0) {
this.buy()
}
}}>
去结算<span>({this.state.checkedNum})</span>
</div>
</div>
}
</div>
</div>
)
}
}
export default connect()(Cart)
\ No newline at end of file
.history/src/components/shopCard/index_20190429111932.js 0 → 100644
import React, { Component } from 'react'
import { connect } from 'react-redux'
import { Checkbox, NavBar } from 'antd-mobile'
//组件
import ShopCard from './cardList.js'
import Loading from '@base/Loading'
//css
import './card.scss'
import classnames from 'classnames'
const mockData = [
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '111',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '112',
check: false
}
]
class Cart extends Component {
constructor(props) {
super(props)
this.state = {
deleteAll: false,
loading: false,
checkedNum: 0,
allPrice: 0,
cartNmu: 0,
data: mockData
}
this.checkChange = this.checkChange.bind(this);
this.getCartList = this.getCartList.bind(this);
this.changeStock = this.changeStock.bind(this);
}
//获取购物车列表
getCartList() {
}
changeStock() {
}
//全选
allChange(e) {
let checked = e.target.checked
let newData = this.state.data.map((item, i) => {
return {
...item,
check: checked
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//点击
checkChange(id, check) {
let newData = this.state.data.map((item, i) => {
console.log(item);
console.log(id);
if (item.id === id) {
return {
...item,
check: check
}
} else {
return item;
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//计算总价
calc(newData) {
let allPrice = 0;
let checkedNum = 0;
let cartNmu = 0;
newData.forEach((item, i) => {
if (item.check) {
cartNmu += 1;
checkedNum = i++;
allPrice += parseFloat(item.newprice);
}
})
this.setState({
checkedNum,
allPrice,
cartNmu
})
}
//购买
buy() {
}
deleteAll() {
}
//装载组件
componentDidMount() {
this.getCartList()
}
render() {
return (
<div className="cart-page" style={{ overflow: 'hidden' }}>
<NavBar
style={{ "height": "44px" }}
className="order-tab"
mode="light"
icon={<i style={{"fontSize": '24px'}} className="iconfont iconiconfront-68"></i>}
rightContent={[
<i key="0" style={{ "fontSize": '24px' }} className="iconfont iconiconfront-56"></i>
]}
>
购物车
</NavBar>
<div className="cart-body">
{
this.state.loading ?
<Loading />
:
<ShopCard getCartList={this.getCartList} changeStock={this.changeStock} checkChange={this.checkChange} data={this.state.data}/>
}
{
this.state.deleteAll ?
<div className="cart-footer">
<div>
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div></div>
<div className={classnames({
'active': this.state.cartNmu > 0
})}
onClick={() => {
if (this.state.cartNmu > 0) {
this.delete()
}
}}>
删除<span>({this.state.cartNmu})</span>
</div>
</div>
:
<div className="cart-footer">
<div className="cart-label">
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div className="all-pirce">
<p>
<span>合计：</span>
<span>￥{this.state.allPrice}</span>
</p>
</div>
<div className={classnames({
'active': this.state.checkedNum > 0
})} onClick={() => {
if (this.state.checkedNum > 0) {
this.buy()
}
}}>
去结算<span>({this.state.checkedNum})</span>
</div>
</div>
}
</div>
</div>
)
}
}
export default connect()(Cart)
\ No newline at end of file
.history/src/components/shopCard/index_20190429111940.js 0 → 100644
import React, { Component } from 'react'
import { connect } from 'react-redux'
import { Checkbox, NavBar } from 'antd-mobile'
//组件
import ShopCard from './cardList.js'
import Loading from '@base/Loading'
//css
import './card.scss'
import classnames from 'classnames'
const mockData = [
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '110',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '111',
check: false
},
{
title: '三月面试求职班',
imgUrl: 'https://julyedu-img-public.oss-cn-beijing.aliyuncs.com/Public/Image/4c5ccac604.jpg',
content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980',
price: '1280',
id: '112',
check: false
}
]
class Cart extends Component {
constructor(props) {
super(props)
this.state = {
deleteAll: false,
loading: false,
checkedNum: 0,
allPrice: 0,
cartNmu: 0,
data: mockData
}
this.checkChange = this.checkChange.bind(this);
this.getCartList = this.getCartList.bind(this);
this.changeStock = this.changeStock.bind(this);
}
//获取购物车列表
getCartList() {
}
changeStock() {
}
//全选
allChange(e) {
let checked = e.target.checked
let newData = this.state.data.map((item, i) => {
return {
...item,
check: checked
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//点击
checkChange(id, check) {
let newData = this.state.data.map((item, i) => {
console.log(item);
console.log(id);
if (item.id === id) {
return {
...item,
check: check
}
} else {
return item;
}
})
this.setState({
data: newData
})
this.calc(newData)
}
//计算总价
calc(newData) {
let allPrice = 0;
let checkedNum = 0;
let cartNmu = 0;
newData.forEach((item, i) => {
if (item.check) {
i++;
cartNmu += 1;
checkedNum = i;
allPrice += parseFloat(item.newprice);
}
})
this.setState({
checkedNum,
allPrice,
cartNmu
})
}
//购买
buy() {
}
deleteAll() {
}
//装载组件
componentDidMount() {
this.getCartList()
}
render() {
return (
<div className="cart-page" style={{ overflow: 'hidden' }}>
<NavBar
style={{ "height": "44px" }}
className="order-tab"
mode="light"
icon={<i style={{"fontSize": '24px'}} className="iconfont iconiconfront-68"></i>}
rightContent={[
<i key="0" style={{ "fontSize": '24px' }} className="iconfont iconiconfront-56"></i>
]}
>
购物车
</NavBar>
<div className="cart-body">
{
this.state.loading ?
<Loading />
:
<ShopCard getCartList={this.getCartList} changeStock={this.changeStock} checkChange={this.checkChange} data={this.state.data}/>
}
{
this.state.deleteAll ?
<div className="cart-footer">
<div>
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div></div>
<div className={classnames({
'active': this.state.cartNmu > 0
})}
onClick={() => {
if (this.state.cartNmu > 0) {
this.delete()
}
}}>
删除<span>({this.state.cartNmu})</span>
</div>
</div>
:
<div className="cart-footer">
<div className="cart-label">
<Checkbox onChange={(e) => {
this.allChange(e)
}} />
<div>全选</div>
</div>
<div className="all-pirce">
<p>
<span>合计：</span>
<span>￥{this.state.allPrice}</span>
</p>
</div>
<div className={classnames({
'active': this.state.checkedNum > 0
})} onClick={() => {
if (this.state.checkedNum > 0) {
this.buy()
}
}}>
去结算<span>({this.state.checkedNum})</span>
</div>
</div>
}
</div>
</div>
)
}
}
export default connect()(Cart)
\ No newline at end of file
src/base/utils/index.js 0 → 100644
//数组去重
export const unique = (array) => {
var n = []; //一个新的临时数组
//遍历当前数组
for (var i = 0; i < array.length; i++) {
//如果当前数组的第i已经保存进了临时数组，那么跳过，
//否则把当前项push到临时数组里面
if (n.indexOf(array[i]) === -1) n.push(array[i]);
}
return n;
}
export const formatTime = (date) => {
var year = date.getFullYear()
var month = date.getMonth() + 1
var day = date.getDate()
return [year, month, day].join('-')
}
// 计算时间相差fn(过去距离当前时间)
export const computingTime = (pastTime) => {
var currentTime = (new Date()).getTime(),
distanceTime = currentTime - pastTime,
// 计算相差天数
days = Math.floor(distanceTime / (24 * 3600 * 1000)),
// 计算相差小时数
leave1 = distanceTime % (24 * 3600 * 1000),
hours = Math.floor(leave1 / (3600 * 1000)),
// 计算相差分钟数
leave2 = leave1 % (3600 * 1000),
minutes = Math.floor(leave2 / (60 * 1000)),
// 计算相差毫秒数
leave3 = leave2 % (60 * 1000),
seconds = Math.round(leave3 / 1000),
// 处理返回格式
dayStr = days <= 0 ? "" : days + "天",
hourStr = hours <= 0 ? "" : hours + "小时",
minuteStr = minutes <= 0 ? "" : minutes + "分钟",
secondStr = (days <= 0 && hours <= 0 && minutes <= 0) ? "刚刚" : "前";
// secondStr=seconds==0?"":seconds+"秒";
if (days >= 1) {
return dayStr + '前';
} else {
return dayStr + hourStr + minuteStr + secondStr;
}
}
// 时间倒计时 (未来距离现在)
export const timeDown = (endDate) => {
var now = new Date();
var leftTime = endDate - now.getTime();
var leftsecond = parseInt(leftTime / 1000);
var day1 = Math.floor(leftsecond / (60 * 60 * 24));
var hour = Math.floor((leftsecond - day1 * 24 * 60 * 60) / 3600);
var minute = Math.floor((leftsecond - day1 * 24 * 60 * 60 - hour * 3600) / 60);
var second = Math.floor(leftsecond - day1 * 24 * 60 * 60 - hour * 3600 - minute * 60);
hour = hour >= 10 ? hour : '0' + hour;
minute = minute >= 10 ? minute : '0' + minute;
second = second >= 10 ? second : '0' + second;
return day1 + '天' + hour + ':' + minute + ':' + second;
return leftTime;
}
// 去除字符串首尾空格
export const strTrim = (s) => {
return s.replace(/(^\s*)|(\s*$)/g, "");
}
export const isPhone = ($poneInput) => {
var myreg = /^[1][3,4,5,7,8][0-9]{9}$/;
if (!myreg.test($poneInput)) {
return true;
} else {
return false;
}
}
\ No newline at end of file
src/common/OrderList/orderlist.scss
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
.public-content{ .public-content{
display: flex; display: flex;
height: 100%; height: 100%;
margin: 0px 15px; // margin: 0px 15px;
padding: 10px 0; padding: 10px 0;
.public-cover{ .public-cover{
flex: 1 0 auto; flex: 1 0 auto;
......
src/components/order/index.js
...@@ -37,7 +37,7 @@ const mockData = [ ...@@ -37,7 +37,7 @@ const mockData = [
function OrderList(props) { function OrderList(props) {
const listData = props.list; const listData = props.list;
return ( return (
<div> <div style={{"padding": "0 15px"}}>
{ {
listData.map((item, index) => { listData.map((item, index) => {
const Info = ( const Info = (
...@@ -112,7 +112,6 @@ class Order extends Component { ...@@ -112,7 +112,6 @@ class Order extends Component {
</div> </div>
<div className="order-list"> <div className="order-list">
<OrderList list={mockData}/> <OrderList list={mockData}/>
</div> </div>
<div className="order-balance"> <div className="order-balance">
<List> <List>
......
src/components/order/order.scss
...@@ -50,6 +50,7 @@ ...@@ -50,6 +50,7 @@
} }
.order-list{ .order-list{
margin-top: 8px; margin-top: 8px;
background-color: $white;
} }
.order-infotext{ .order-infotext{
flex: 1; flex: 1;
......
src/components/shopCard/card.scss
...@@ -19,7 +19,7 @@ ...@@ -19,7 +19,7 @@
flex: 1; flex: 1;
margin-bottom: 50px; margin-bottom: 50px;
display: flex; display: flex;
background-color:#fff; background-color: $bg_f5f5f5;
overflow-y: auto; overflow-y: auto;
position: relative; position: relative;
.cart-main{ .cart-main{
...@@ -64,21 +64,22 @@ ...@@ -64,21 +64,22 @@
.am-list-line{ .am-list-line{
padding-right: 0px; padding-right: 0px;
} }
border-bottom: 1px solid #eee;
.am-list-content{ .am-list-content{
position: relative; position: relative;
} }
.cart-c-item{ .cart-c-item{
overflow: hidden; overflow: hidden;
position: relative; position: relative;
padding:10px 10px 10px 0; margin: 8px 0;
padding-right: 10px;
box-sizing: border-box; box-sizing: border-box;
background-color: $white;
.cart-c-check{ .cart-c-check{
width:40px; width:40px;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
height:calc(100% - 20px); height: 100%;
box-sizing: border-box; box-sizing: border-box;
position: absolute; position: absolute;
} }
...@@ -217,3 +218,6 @@ ...@@ -217,3 +218,6 @@
align-items: center; align-items: center;
padding-right: 12px; padding-right: 12px;
} }
.card-wrap{
margin-left: 40px;
}
src/components/shopCard/cardItem.js 0 → 100644
import React, { Component } from 'react';
import { Checkbox } from 'antd-mobile';
import OrderList from '@/common/OrderList';
class CardItem extends Component {
// 构造函数
constructor(props) {
super(props)
this.state = {
val: props.item.value
}
}
// 改变选择
onChange(e, id) {
let checked = e.target.checked;
// console.log(checked,id)
this.props.checkChange(id, checked)
}
// 修改购物车
editCart(it, val) {
}
// 删除购物车
delete(id) {
}
//跳转
goto(id) {
}
//render
render() {
let item = this.props.item
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
return (
<div className="cart-c-item" >
<div className="cart-c-check">
<Checkbox checked={item.check} onChange={(e) => {
this.onChange(e, item.id)
}} />
</div>
<div className="card-wrap">
<OrderList info={Info}></OrderList>
</div>
</div>
)
}
}
export default CardItem;
\ No newline at end of file
src/components/shopCard/cardList.js 0 → 100644
import React, { Component } from 'react'
import CardItem from './cardItem'
class ShopCard extends Component {
render() {
return (
<div className="cart-main">
{/* 遍历购物车商品列表 */}
<div className="cart-c-body">
{
this.props.data.length > 0 ?
this.props.data.map((item, i) => {
return (
<CardItem
index={i}
changeStock={(id, val) => {
this.props.changeStock(id, val)
}}
checkChange={(id, val) => {
this.props.checkChange(id, val)
}}
getCartList={() => {
this.props.getCartList()
}} key={i} item={item}></CardItem>
)
})
: <div className="cart-tip">暂无商品</div>
}
</div>
</div>
)
}
}
export default ShopCard;
\ No newline at end of file
src/components/shopCard/index.js
...@@ -2,7 +2,7 @@ import React, { Component } from 'react' ...@@ -2,7 +2,7 @@ import React, { Component } from 'react'
import { connect } from 'react-redux' import { connect } from 'react-redux'
import { Checkbox, NavBar } from 'antd-mobile' import { Checkbox, NavBar } from 'antd-mobile'
//组件 //组件
import { OrderItem } from '@/common/index' import ShopCard from './cardList.js'
import Loading from '@base/Loading' import Loading from '@base/Loading'
//css //css
...@@ -25,7 +25,7 @@ const mockData = [ ...@@ -25,7 +25,7 @@ const mockData = [
content: '涵盖ML主流算法及其应用-文字超过一行换行', content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980', newprice: '980',
price: '1280', price: '1280',
id: '110', id: '111',
check: false check: false
}, },
{ {
...@@ -34,48 +34,11 @@ const mockData = [ ...@@ -34,48 +34,11 @@ const mockData = [
content: '涵盖ML主流算法及其应用-文字超过一行换行', content: '涵盖ML主流算法及其应用-文字超过一行换行',
newprice: '980', newprice: '980',
price: '1280', price: '1280',
id: '110', id: '112',
check: false check: false
} }
] ]
function OrderList(props) {
const listData = props.list;
return (
<div style={{"backgroundColor": "#f5f5f5"}}>
{
listData.map((item, index) => {
const Info = (
<div className="order-info">
<p className='order-title'>{item.title}</p>
<p className='order-content'>{item.content}</p>
<p className='order-des'>
<span className='order-newprice'>¥{item.newprice}</span>
<span className='order-price'>¥{item.price}</span>
</p>
</div>
)
const Tab = (
<div className="shopcard-check">
<Checkbox
checked={item.check}
onChange={(e) => {
// this.onChange(e, item.id)
}}
/>
</div>
)
return (
<OrderItem {...item} key={index} tab={ Tab } info={Info}>
</OrderItem>
)
})
}
</div>
);
}
class Cart extends Component { class Cart extends Component {
constructor(props) { constructor(props) {
super(props) super(props)
...@@ -89,11 +52,16 @@ class Cart extends Component { ...@@ -89,11 +52,16 @@ class Cart extends Component {
} }
this.checkChange = this.checkChange.bind(this); this.checkChange = this.checkChange.bind(this);
this.getCartList = this.getCartList.bind(this);
this.changeStock = this.changeStock.bind(this);
} }
//获取购物车列表 //获取购物车列表
getCartList() { getCartList() {
} }
changeStock() {
}
//全选 //全选
allChange(e) { allChange(e) {
let checked = e.target.checked let checked = e.target.checked
...@@ -112,6 +80,8 @@ class Cart extends Component { ...@@ -112,6 +80,8 @@ class Cart extends Component {
//点击 //点击
checkChange(id, check) { checkChange(id, check) {
let newData = this.state.data.map((item, i) => { let newData = this.state.data.map((item, i) => {
console.log(item);
console.log(id);
if (item.id === id) { if (item.id === id) {
return { return {
...item, ...item,
...@@ -133,8 +103,9 @@ class Cart extends Component { ...@@ -133,8 +103,9 @@ class Cart extends Component {
let cartNmu = 0; let cartNmu = 0;
newData.forEach((item, i) => { newData.forEach((item, i) => {
if (item.check) { if (item.check) {
i++;
cartNmu += 1; cartNmu += 1;
checkedNum += i; checkedNum = i;
allPrice += parseFloat(item.newprice); allPrice += parseFloat(item.newprice);
} }
}) })
...@@ -175,7 +146,7 @@ class Cart extends Component { ...@@ -175,7 +146,7 @@ class Cart extends Component {
this.state.loading ? this.state.loading ?
<Loading /> <Loading />
: :
<OrderList checkChange={this.checkChange} list={this.state.data} /> <ShopCard getCartList={this.getCartList} changeStock={this.changeStock} checkChange={this.checkChange} data={this.state.data}/>
} }
...@@ -191,7 +162,8 @@ class Cart extends Component { ...@@ -191,7 +162,8 @@ class Cart extends Component {
<div></div> <div></div>
<div className={classnames({ <div className={classnames({
'active': this.state.cartNmu > 0 'active': this.state.cartNmu > 0
})} onClick={() => { })}
onClick={() => {
if (this.state.cartNmu > 0) { if (this.state.cartNmu > 0) {
this.delete() this.delete()
} }
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment