Compare commits

...

30 Commits

Author SHA1 Message Date
d1ab78d35a change start dockerfile 2023-01-18 17:30:33 +07:00
cd8cc52f18 feat: Adjust route from register to dashboard 2023-01-18 16:18:41 +07:00
4a5e15c55c Merge branch 'bukopin' into devops-staging 2023-01-18 15:55:20 +07:00
0abfb5245a style: Adjust item card height 2023-01-18 15:55:08 +07:00
dec43f819d Merge branch 'bukopin' into devops-staging 2023-01-18 15:40:21 +07:00
5467d91085 feat: Items based on category voucher 2023-01-18 15:40:08 +07:00
e2cb987ded Merge branch 'bukopin' into devops-staging 2023-01-18 14:17:27 +07:00
1206c4f013 fix: Adjust redeem voucher message 2023-01-18 14:17:01 +07:00
e8553ea12f Merge branch 'bukopin' into devops-staging 2023-01-18 13:37:12 +07:00
ffaae28e64 feat:
- Redeem Code
2023-01-18 13:36:31 +07:00
4a7dfe6d52 feat:
- Revamp Design
- Adjust anomaly in design
2023-01-18 12:30:00 +07:00
5840ec682f fix k8s staging 2023-01-18 12:29:43 +07:00
9b915d22c6 feat:
- Revamp Design
- Adjust anomaly in design
2023-01-18 12:29:29 +07:00
9e39000483 dockerfile 2023-01-18 12:15:42 +07:00
35ce9e2484 fix error on install && dockerfile 2023-01-18 12:13:08 +07:00
6e83553e86 fix dockerfile 2023-01-18 12:09:02 +07:00
7a4ea8c528 fix dockerfile 2023-01-18 12:07:32 +07:00
c154ccc0f6 Merge pull request 'bukopin' (#1) from bukopin into devops-staging
Reviewed-on: #1
2023-01-18 11:50:37 +07:00
d46407cc68 Fix: Error on run 2023-01-18 11:34:11 +07:00
26e6047805 Merge remote-tracking branch 'origin/bukopin' into bukopin 2023-01-18 03:12:46 +07:00
470a70cb1f Adjust Design 2023-01-18 03:12:40 +07:00
“marselinowidis”
b2a0cc9cdc fix dockerfile 2023-01-17 23:59:19 +07:00
“marselinowidis”
0a482dd766 fix dockerfile 2023-01-17 23:41:42 +07:00
“marselinowidis”
8a8d7c0e74 fix dockerfile 2023-01-17 23:40:55 +07:00
“marselinowidis”
8c02184bd9 fix dockerfile 2023-01-17 23:33:25 +07:00
“marselinowidis”
07634ef503 fix dockerfile 2023-01-17 23:28:01 +07:00
ba8629005e add manifest k8s 2023-01-17 23:21:08 +07:00
ba84c86493 Test push 2023-01-17 23:15:47 +07:00
9169538996 feat: add more to .gitignore 2023-01-17 21:29:27 +07:00
9f0c68b2ce feat: initial commit for mockup bukopin 2023-01-17 21:27:45 +07:00
45 changed files with 6302 additions and 580651 deletions

3
.gitignore vendored
View File

@@ -49,3 +49,6 @@ settings.json
dist/
public/assets
public/static
public/static/**/*.js
public/static/**/*.js.map

View File

@@ -1,7 +1,9 @@
FROM node:8-alpine
RUN apk add --no-cache libc6-compat
RUN apk add --no-cache git
WORKDIR /app
COPY package.json /app
RUN yarn
COPY package.json package-lock.json /app/
RUN npm install
COPY . /app
CMD npm run watch
EXPOSE 8080
CMD npm run start
EXPOSE 7700

Binary file not shown.

After

Width:  |  Height:  |  Size: 56 KiB

23
k8s/staging/deployment.yaml Executable file
View File

@@ -0,0 +1,23 @@
apiVersion: apps/v1
kind: Deployment
metadata:
name: bukopin-redemption-client-react
namespace: bukopin-staging
spec:
selector:
matchLabels:
app: bukopin-redemption-client-react
replicas: 1
template:
metadata:
labels:
app: bukopin-redemption-client-react
spec:
containers:
- name: bukopin-redemption-client-react
image: registry-harbor.app.bangun-kreatif.com/bukopin/bukopin-redemption-client-react:<VERSION>
ports:
- containerPort: 7700
imagePullSecrets:
- name: regcred

25
k8s/staging/ingress.yaml Executable file
View File

@@ -0,0 +1,25 @@
apiVersion: networking.k8s.io/v1
kind: Ingress
metadata:
name: bukopin-redemption-client-react
namespace: bukopin-staging
annotations:
kubernetes.io/ingress.class: "traefik"
cert-manager.io/cluster-issuer: letsencrypt-prod
traefik.ingress.kubernetes.io/router.middlewares: bukopin-staging-redirect-https@kubernetescrd
spec:
rules:
- host: "bukopin-fe.k3s.bangun-kreatif.com"
http:
paths:
- pathType: Prefix
path: /
backend:
service:
name: bukopin-redemption-client-react
port:
number: 7700
tls:
- hosts:
- "bukopin-fe.k3s.bangun-kreatif.com"
secretName: bukopin-fe-k3s-bangun-kreatif-com-tls

View File

@@ -0,0 +1,9 @@
apiVersion: traefik.containo.us/v1alpha1
kind: Middleware
metadata:
name: redirect-https
namespace: bukopin-staging
spec:
redirectScheme:
scheme: https
permanent: true

View File

@@ -0,0 +1,4 @@
apiVersion: v1
kind: Namespace
metadata:
name: bukopin-staging

13
k8s/staging/service.yaml Executable file
View File

@@ -0,0 +1,13 @@
apiVersion: v1
kind: Service
metadata:
name: bukopin-redemption-client-react
namespace: bukopin-staging
labels:
run: bukopin-redemption-client-react
spec:
ports:
- port: 7700
protocol: TCP
selector:
app: bukopin-redemption-client-react

18285
package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@@ -4,7 +4,7 @@
"description": "Server-side rendering with mobx and react-router",
"main": "src/index.js",
"scripts": {
"start": "node src/index.js",
"start": "node -r esm src/index.js",
"babel-node": "node node_modules/@babel/node/bin/babel-node.js --presets=@babel/preset-env --plugins=@babel/plugin-transform-runtime",
"watch:client": "webpack --watch",
"watch:server": "npm run babel-node -- ./src/index.js",
@@ -55,6 +55,7 @@
"cssnano": "^4.1.8",
"debug": "^4.1.1",
"decimal.js-light": "^2.3.1",
"esm": "^3.2.25",
"exenv": "^1.2.2",
"express": "^4.16.2",
"faker": "^4.1.0",
@@ -90,7 +91,6 @@
"mobx-react": "^5.4.3",
"mobx-react-devtools": "^6.0.3",
"moment": "^2.24.0",
"nwbuild": "0.0.5",
"parcel-bundler": "^1.11.0",
"prop-types": "^15.6.2",
"raw-loader": "^0.5.1",
@@ -108,7 +108,6 @@
"react-easy-print": "^0.6.0-beta.3",
"react-flexible-carousel": "^1.2.6",
"react-froala-wysiwyg": "^2.8.4",
"react-gif": "^0.1.0",
"react-google-charts": "^3.0.8",
"react-grid-gallery": "^0.5.2",
"react-handsontable": "^0.3.1",

View File

@@ -2,9 +2,9 @@
<html>
<head>
<meta charset="utf-8">
<title>BTN</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<link rel="icon" type="image/png" href="/assets/images/logo-bankbtn.png" sizes="96x96" />
<title>KB Bukopin</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<link rel="icon" type="image/png" href="/assets/images/kb_bukopin.jpeg" sizes="96x96" />
<style>
body {
visibility: hidden;

View File

@@ -2,9 +2,9 @@
<html>
<head>
<meta charset="utf-8">
<title>BTN</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<link rel="icon" type="image/png" href="/assets/images/logo-bankbtn.png" sizes="96x96" />
<title>KB Bukopin</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<link rel="icon" type="image/png" href="/assets/images/kb_bukopin.jpeg" sizes="96x96" />
<style>
body {
visibility: hidden;

View File

@@ -2,9 +2,9 @@
<html>
<head>
<meta charset="utf-8">
<title>BTN</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<link rel="icon" type="image/png" href="/assets/images/logo-bankbtn.png" sizes="96x96" />
<title>KB Bukopin</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<link rel="icon" type="image/png" href="/assets/images/kb_bukopin.jpeg" sizes="96x96" />
<style>
body {
visibility: hidden;

View File

@@ -2,9 +2,9 @@
<html>
<head>
<meta charset="utf-8">
<title>BTN</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<link rel="icon" type="image/png" href="/assets/images/logo-bankbtn.png" sizes="96x96" />
<title>KB Bukopin</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<link rel="icon" type="image/png" href="/assets/images/kb_bukopin.jpeg" sizes="96x96" />
<style>
body {
visibility: hidden;

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@@ -24,13 +24,13 @@ let type = 'akuntiket';
// apiUrl = "https://marketplace-sillyfish-api.asacreative.com/v1/";
// imageUrl = "https://marketplace-sillyfish-api.asacreative.com";
apiUrl = "https://giift-api.asacreative.com/";
imageUrl = "https://giift-api.asacreative.com";
apiUrl = "https://herbal-backend.k3s.bangun-kreatif.com/v1/";
imageUrl = "https://herbal-backend.k3s.bangun-kreatif.com/v1/";
type = 'localhost';
if(window.location.href.includes("localhost") || window.location.href.includes("marketplace-store")){
// appUrl = 'http://localhost:7700';
apiUrl = "https://giift-api.asacreative.com/";
// apiUrl = "https://giift-api.asacreative.com/";
// apiUrl = "http://localhost:4001/"
}else{
// appUrl = 'https://sillyfish.asacreative.com';

View File

@@ -20,7 +20,7 @@ import {
// Drawer,
// List,
// ListItem,
// IconMenu,
IconMenu,
// IconButton,
// MenuItem,
DropDownMenu,
@@ -29,8 +29,8 @@ import {
Dialog,
Snackbar,
// Toolbar,
// ToolbarGroup,
// ToolbarSeparator,
ToolbarGroup,
ToolbarSeparator,
// ToolbarTitle,
// Badge
} from 'material-ui';
@@ -260,10 +260,6 @@ class App extends React.Component {
});
}
openCreateProjectDialog() {
}
handleToggleIcon = () => this.setState({ open: !this.state.open });
handleToggleIconSecondary = () => this.setState({ openSecondary: !this.state.openSecondary });
handleClose = () => this.setState({ open: false });
@@ -373,8 +369,8 @@ class App extends React.Component {
let applicationIcon = require('../../../../assets/images/logo_new.png');
let applicationName = 'Giift';
if (APP_TYPE === 'btn') {
applicationIcon = "http://btn-redemption-2.bangun-kreatif.com/dr6u0fppdi4xy.cloudfront.net/FilesDirectory/Albilad/ImgIconImage/logo-btn.png";
applicationName = "BTN";
applicationIcon = "https://www.niaga.asia/wp-content/uploads/2021/02/IMG-20210223-WA0025.jpg";
applicationName = "KB Bukopin";
}
let onNotifRowClick = (record) => {
@@ -564,7 +560,7 @@ class App extends React.Component {
<WithdrawDialog />
<div className={classes.root}>
<AppBar position="fixed">
<AppBar style={{ zIndex: 1 }} position="fixed">
<Toolbar className={classes.toolbar}>
<div className={classes.sectionMobile}>
<IconButton className={classes.menuButton} color="action" aria-label="Open drawer" onClick={this.toggleDrawerNew(true)}>
@@ -577,8 +573,8 @@ class App extends React.Component {
<img
className={classes.title}
style={{
width: 100,
height: 30
width: 70,
height: 40
}}
src={applicationIcon} />
</Link>

View File

@@ -9,7 +9,7 @@ export const styles = theme => ({
width: "100%",
top: 0,
zIndex: 1000,
backgroundColor: yellow['500'],
backgroundColor: '#FAAF03',
height: '70px !important',
padding: "8px 24px",
borderBottom: "1px solid rgb(223, 223, 223)"
@@ -94,4 +94,4 @@ export const styles = theme => ({
fullList: {
width: 'auto',
},
});
});

View File

@@ -26,7 +26,7 @@ import {lowerCase,debounce} from 'lodash';
// import 'froala-editor/css/froala_style.min.css';
// import 'froala-editor/css/froala_editor.pkgd.min.css';
const $ = require("jquery");
require("froala-editor/js/froala_editor.pkgd.min.js")($);
// require("froala-editor/js/froala_editor.pkgd.min.js")($);
window.$ = window.jQuery = $;
// require("froala-editor/js/froala_editor.pkgd.min.js")($);
// require("froala-editor/js/plugins/code_view.min.js")($);
@@ -109,14 +109,14 @@ export default class Form extends React.Component {
async componentDidMount() {
console.log(this.props.match.params.id,'ini id params')
window.scrollTo(0, 0);
this.contentManagerStore.getTags();
// this.contentManagerStore.getTypes();
this.contentManagerStore.clearItems();
if(this.props.match.params.id){
this.contentManagerStore.getDetail(this.props.match.params.id).then(res => {
this.contentManagerStore.getDetail(this.props.match.params.id).then(res => {
console.log(this.contentManagerStore.selected.title,this.contentManagerStore.selected.content,'res detail')
let newArray = this.contentManagerStore.selected.additional_data.items.map(it => it);
let newTagsArray =this.contentManagerStore.selected.tags.map(it => it);
@@ -157,7 +157,7 @@ export default class Form extends React.Component {
// setTimeout(() => {
// $('.fr-wrapper').children[0].style.display = 'none';
// }, 1000);
}
handleModelChange = (model) => {
@@ -209,14 +209,14 @@ export default class Form extends React.Component {
.catch(err => {
this.globalUI.openSnackbar(err.message);
console.error(err, 'ini errornya');
});
}
};
deleteData = () => {
};
searchItem = ()=>{
@@ -245,10 +245,10 @@ export default class Form extends React.Component {
.catch(err => {
this.globalUI.openSnackbar(err.message);
console.error(err, 'ini errornya');
});
}
};
handleBackClose = () => {
@@ -314,7 +314,7 @@ export default class Form extends React.Component {
console.log("new fileList",newFileList);
this.setState({fileList : newFileList});
})
}
@@ -469,10 +469,10 @@ export default class Form extends React.Component {
}
}, () => {
console.log("value",this.state.formData.additional_data[key]);
console.log("value2",v);
console.log("key",key);
});
}
});
@@ -675,10 +675,10 @@ export default class Form extends React.Component {
)}
</div>
) : ('')}
{this.props.match.params.id ? (<ButtonAntd type={'primary'} style={{width: '100%', marginTop: 25}} onClick={this.handleOpen} icon={'save'}>Save</ButtonAntd>) : (<ButtonAntd type={'primary'} style={{width: '100%', marginTop: 25}} onClick={this.handleOpen} icon={'upload'}>Publish</ButtonAntd>)}
</div>
</Card>
</Affix>

View File

@@ -199,7 +199,7 @@ class DashboardComponent extends React.Component {
Voucher
</Typography>
<Typography component="p">
<NumberFormat value={(0).toFixed(2)} displayType={'text'} thousandSeparator={true} prefix={'Rp '} />
<NumberFormat value={(this.props.appstate.wallet.data.wallet).toFixed(2)} displayType={'text'} thousandSeparator={true} prefix={'Rp '} />
</Typography>
</MuiCardContent>
<MuiCardActions>
@@ -330,7 +330,8 @@ class DashboardComponent extends React.Component {
style={{ marginTop: 15 }}>
{(this.vouchersStore.list.length > 0) ?
this.vouchersStore.list.map((item, index) => {
let image = get(item, 'images.logo', '');
console.log("itemm", item)
let image = get(item, 'images.main', '');
if (!image.includes('http')) {
image = this.http.appendImagePath(image);

View File

@@ -46,7 +46,7 @@ export default class LoginComponent extends React.Component {
let loginImage = 'http://giift.asacreative.com/giift_logo_wide.4d15de72.png';
if(APP_TYPE === 'btn') {
loginImage = 'http://btn-redemption-2.bangun-kreatif.com/dr6u0fppdi4xy.cloudfront.net/FilesDirectory/Albilad/ImgIconImage/logo-btn.png'
loginImage = 'https://www.niaga.asia/wp-content/uploads/2021/02/IMG-20210223-WA0025.jpg'
}
return (
<div className="loginWrapper">

View File

@@ -30,7 +30,7 @@ export const styles = theme => ({
},
logoContainer : {
textAlign : 'center',
background : yellow['500'],
background : '#FAAF03',
padding : 20
}
});
});

View File

@@ -73,7 +73,7 @@ export default class ComponentName extends React.Component {
// description: 'Please check your email to continue'
// });
this.props.history.push({
pathname:LINKS.REGISTER_COMPLETED
pathname:LINKS.DASHBOARD
});
this.setState({isLoading: false, isSuccess: true})
// this

View File

@@ -75,7 +75,7 @@ export default class RegisterCompletedComponent extends React.Component{
<Grid item xs={6}>
<img src={require('../../../../assets/images/login/register_image_2.png')} width={"80%"}/>
<Typography style={{color : '#FFF'}} variant={"h6"}>
Selamat Datang di BTN Point
Selamat Datang di KB Bukopin
</Typography>
<Typography style={{color : '#FFF'}} variant={"subtitle2"}>
Daftar untuk mendapatkan berbagai macam manfaat dan keuntungan

View File

@@ -129,6 +129,7 @@ class RegisterPage extends React.Component {
});
}
{console.log("namee", name)}
this.setState({
[name]: event.target.value,
});
@@ -208,45 +209,46 @@ class RegisterPage extends React.Component {
no_rekening : this.state.no_rekening
}
};
this.authStore.register(data).then(res => {
//message.success("Please check your email to confirm your account");this.props.history.push(LINKS.LOGIN);
setTimeout(() => {
this.setState({ isLoading: false });
this.props.history.push(LINKS.REGISTER_COMPLETED);
// this.props.history.push(LINKS.LOGIN);
}, 250);
}).catch(err => {
this.setState({ isLoading: false });
if (err.type === 'BodyValidationError') {
message.error(err.detail[0].message);
} else {
if (err.message.toLowerCase().includes('email')) {
this.setState({
errors: {
...this.state.errors,
email_exists: 'Email sudah terdaftar'
}
})
} else if (err.message.toLowerCase().includes('phone number')) {
this.setState({
errors: {
...this.state.errors,
phone_exists: 'Nomer handphone sudah terdaftar'
}
})
} else if (err.message.toLowerCase().includes('referal')) {
this.setState({
errors: {
...this.state.errors,
referal_not_found: 'Kode Referal Salah - Silahkan Hubungi Petugas BTN'
}
})
} else {
message.error(err.message);
}
}
});
this.props.history.push(LINKS.DASHBOARD);
// this.authStore.register(data).then(res => {
// //message.success("Please check your email to confirm your account");this.props.history.push(LINKS.LOGIN);
// setTimeout(() => {
// this.setState({ isLoading: false });
// this.props.history.push(LINKS.REGISTER_COMPLETED);
// // this.props.history.push(LINKS.LOGIN);
// }, 250);
// }).catch(err => {
// this.setState({ isLoading: false });
//
// if (err.type === 'BodyValidationError') {
// message.error(err.detail[0].message);
// } else {
// if (err.message.toLowerCase().includes('email')) {
// this.setState({
// errors: {
// ...this.state.errors,
// email_exists: 'Email sudah terdaftar'
// }
// })
// } else if (err.message.toLowerCase().includes('phone number')) {
// this.setState({
// errors: {
// ...this.state.errors,
// phone_exists: 'Nomer handphone sudah terdaftar'
// }
// })
// } else if (err.message.toLowerCase().includes('referal')) {
// this.setState({
// errors: {
// ...this.state.errors,
// referal_not_found: 'Kode Referal Salah - Silahkan Hubungi Petugas BTN'
// }
// })
// } else {
// message.error(err.message);
// }
// }
// });
};
handleChangeUploadKtp = (info) => {
@@ -358,7 +360,7 @@ class RegisterPage extends React.Component {
<Grid container spacing={0} className={classes.gridContainer}>
<Grid item cols={12} className={classes.logoContainer}>
<img src={require('../../../../assets/images/logo_new.png')} className={classes.logo} />
<img src={require('../../../../assets/images/kb_bukopin.jpeg')} className={classes.logo} />
</Grid>
<Grid item xs={12} sm={12} md={10} lg={10} className={classes.registerContainer} style={{
alignSelf: 'center'
@@ -368,10 +370,10 @@ class RegisterPage extends React.Component {
<Grid item xs={5}>
<img src={require('../../../../assets/images/register_image_2.png')} width={"80%"} />
<Typography style={{ color: '#FFF' }} variant={"h6"}>
Selamat Datang di BTN Shop!
Selamat Datang di Bukopin Shop!
</Typography>
<Typography style={{ color: '#FFF' }} variant={"subtitle2"}>
Dapatkan promo dan keuntungan lebih dari BTN!
Dapatkan promo dan keuntungan lebih dari Bukopin!
</Typography>
</Grid>
</Hidden>
@@ -634,7 +636,7 @@ class RegisterPage extends React.Component {
<div style={{ padding: 5, marginTop: 20 }}>
<Button
fullWidth
variant="contained" style={{ backgroundColor: '#ffeb3b' }} onClick={this.register}>
variant="contained" style={{ backgroundColor: '#FAAF03' }} onClick={this.register}>
{this.state.isLoading ? <CircularProgress className={classes.progress} /> : "Daftar"}
</Button>

View File

@@ -4,7 +4,7 @@ export const styles = theme => ({
flex :1,
flexGrow : 1,
height : "100vh",
backgroundColor:'#024f8e',
backgroundColor:'#FEFAF0',
marginTop: '-56px',
},
gridContainer : {
@@ -31,7 +31,7 @@ export const styles = theme => ({
},
logoContainer : {
textAlign : 'center',
background : yellow['500'],
background : '#FAAF03',
padding : 20
},
});

View File

@@ -40,10 +40,11 @@ export default class ItemList extends React.Component {
<p className={'transactionDate'}>{moment(data.updated_at).format("dddd, MMMM Do YYYY, HH:mm:ss")}</p>
</div>
<div className={'bodyContainer'}>
<p className={'nameText'}>{data.item.name + " : " + data.item_sku.name}</p>
<p className={'nameText'}>{data.item.name}</p>
<div className={'childContainer'}>
<p className={'childTitle'}>Price</p>
<p className={'childText'}>{(+data.item_sku.price).toFixed(0)} Points</p>
{/*<p className={'childText'}>{(+data.price).toFixed(0)} Points</p>*/}
<p className={'childText'}>{data.price} Points</p>
</div>
<div className={'childContainer'}>
<p className={'childTitle'}>Voucher Code</p>

View File

@@ -29,41 +29,35 @@ export default class TransactionPage extends React.Component {
created_at: moment(faker.date.past()).format("dddd, MMMM Do YYYY, HH:mm:ss"),
updated_at: moment(faker.date.past()).format("dddd, MMMM Do YYYY, HH:mm:ss"),
deleted_at: null,
name: faker.commerce.productName(),
status: 'Transaction Success',
price: faker.commerce.price(),
item: {
name: faker.commerce.productName(),
},
item_sku: {
name: faker.commerce.productName(),
},
transaction: {
status: 'Transaction Success',
},
price: faker.commerce.price(1000, 1000000, 0, ''),
voucher_code: `${faker.random.alphaNumeric(5).toUpperCase()} - ${faker.random.alphaNumeric(5).toUpperCase()} - ${faker.random.alphaNumeric(5).toUpperCase()} - ${faker.random.alphaNumeric(5).toUpperCase()} - ${faker.random.alphaNumeric(5).toUpperCase()}`,
},
{
transaction_id: `INV/20190101/VII/X/${faker.random.alphaNumeric(6).toUpperCase()}`,
created_at: moment(faker.date.past()).format("dddd, MMMM Do YYYY, HH:mm:ss"),
updated_at: moment(faker.date.past()).format("dddd, MMMM Do YYYY, HH:mm:ss"),
updated_at: moment(faker.date.past(5, '2020-01-01T00:00:00.000Z')).format("dddd, MMMM Do YYYY, HH:mm:ss"),
deleted_at: null,
name: faker.commerce.productName(),
status: 'Transaction Success',
item: {
name: faker.commerce.productName(),
},
item_sku: {
name: faker.commerce.productName(),
},
transaction: {
status: 'Transaction Success',
},
price: faker.commerce.price(),
voucher_code: `${faker.random.alphaNumeric(5).toUpperCase()} - ${faker.random.alphaNumeric(5).toUpperCase()} - ${faker.random.alphaNumeric(5).toUpperCase()} - ${faker.random.alphaNumeric(5).toUpperCase()} - ${faker.random.alphaNumeric(5).toUpperCase()}`,
},
{
transaction_id: `INV/20190101/VII/X/${faker.random.alphaNumeric(6).toUpperCase()}`,
created_at: moment(faker.date.past()).format("dddd, MMMM Do YYYY, HH:mm:ss"),
updated_at: moment(faker.date.past()).format("dddd, MMMM Do YYYY, HH:mm:ss"),
deleted_at: null,
name: faker.commerce.productName(),
status: 'Transaction Success',
price: faker.commerce.price(),
voucher_code: `${faker.random.alphaNumeric(5).toUpperCase()} - ${faker.random.alphaNumeric(5).toUpperCase()} - ${faker.random.alphaNumeric(5).toUpperCase()} - ${faker.random.alphaNumeric(5).toUpperCase()} - ${faker.random.alphaNumeric(5).toUpperCase()}`,
},
{
transaction_id: `INV/20190101/VII/X/${faker.random.alphaNumeric(6).toUpperCase()}`,
created_at: moment(faker.date.past()).format("dddd, MMMM Do YYYY, HH:mm:ss"),
updated_at: moment(faker.date.past()).format("dddd, MMMM Do YYYY, HH:mm:ss"),
deleted_at: null,
name: faker.commerce.productName(),
status: 'Transaction Success',
price: faker.commerce.price(),
voucher_code: `${faker.random.alphaNumeric(5).toUpperCase()} - ${faker.random.alphaNumeric(5).toUpperCase()} - ${faker.random.alphaNumeric(5).toUpperCase()} - ${faker.random.alphaNumeric(5).toUpperCase()} - ${faker.random.alphaNumeric(5).toUpperCase()}`,
},
}
];
return(
@@ -91,8 +85,8 @@ export default class TransactionPage extends React.Component {
<div className={'listContainer'}>
{
(this.purchasedVoucher.data.length > 0) ?
this.purchasedVoucher.data.map(item => {
(data.length > 0) ?
data.map(item => {
return <ItemList data={item}/>
}) :
(

View File

@@ -6,7 +6,7 @@
align-items: center;
.parentContainer{
width: 40vw;
width: 60vw;
.barContainer{
display: flex;

View File

@@ -46,7 +46,7 @@ export class CheckoutVouchers extends React.Component {
render() {
const {classes} = this.props;
const logoUrl = (this.props.vouchersStore.dataItems.images.logo) ? get(this.vouchersStore.dataItems, 'images.logo', '') : 'http://lorempixel.com/400/200';
const logoUrl = (this.props.vouchersStore.dataItems.images.main) ? get(this.vouchersStore.dataItems, 'images.main', '') : 'http://lorempixel.com/400/200';
let image = logoUrl;

View File

@@ -1,7 +1,7 @@
@media(min-width: 1000px){
.imageCard{
width: 20vw;
height: 25vh;
height: 35vh;
}
.upper-card{

View File

@@ -29,12 +29,16 @@ export class ItemCard extends React.Component {
render() {
const {data = {}} = this.props;
let image = get(data, 'images.logo', '');
// console.log({data})
let image = get(data, 'images.main', '');
if (!image.includes('http')) {
image = this.http.appendImagePath(image);
}
console.log({image})
return (
<Card className={'itemCard'}>
<img className={'imageCard'} src={image}/>

View File

@@ -40,7 +40,7 @@ export default class ModalVouchersComponent extends React.Component {
render() {
const {item} = this.props.appstate;
const {data = {}, isVisible = false, onOk = () => {}, onCancel = () => {}, title='Modal'} = this.props;
let image = get(data, 'images.logo', '');
let image = get(data, 'images.main', '');
if (!image.includes('http')) {
image = this.http.appendImagePath(image);
@@ -102,38 +102,45 @@ export default class ModalVouchersComponent extends React.Component {
placeholder="Please Select your Option"
optionFilterProp="children"
onChange={(value) => {
console.log({value})
this.setState({selectedOption: value});
this.setState({hidden: 'none'});
// console.log('onChange',value);
const points = item.selectedData.sku.filter(item => item.id == value);
// const points = item.selectedData.sku.filter(item => item.id == value);
this.setState({
skuName :points[0].name,
skuPrice : points[0].price,
buttonDisbaled:false
skuName : get(data, 'name', '').name,
skuPrice : get(data, 'regular_price', '0.0'),
buttonDisbaled: false
})
}
}
}}
onDropdownVisibleChange={(value) => {
this.setState({hidden: 'inline'})
}}
>
{(item.selectedData.sku || []).map((item, index) => {
{(item.selectedData.sku || [{
vouchers: [{count: +get(data, 'stock', '0.0')}],
price: get(data, 'regular_price', '0.0'),
id: get(data, 'id', ''),
name: get(data, 'name', '')
}]).map((selectedItem, index) => {
// const {vouchers:[{count}]} = item;
console.log({item: selectedItem})
let count = 1;
if (data.source === 'internal') {
count = get(item, 'vouchers[0].count', 0) || 0;
count = get(selectedItem, 'vouchers[0].count', 0) || 0;
}
console.log(count);
const outOfStock = !(+count > 0);
return (
<Option disabled={outOfStock} value={item.id}>
<Option disabled={outOfStock} value={selectedItem.id}>
<div style={{display:'flex',justifyContent:'space-between', width:'100%'}}>
<span>{item.name} {outOfStock ? " - Out of Stock" : ""}</span>
<span>{selectedItem.name} {outOfStock ? " - Out of Stock" : ""}</span>
<span style={{color:'#FF6F00', display:this.state.hidden}}>
Rp. <NumberFormat value={(+item.price).toFixed(0)} displayType={'text'} thousandSeparator={true}/>
Rp. <NumberFormat value={(+selectedItem.price).toFixed(0)} displayType={'text'} thousandSeparator={true}/>
</span>
</div>
</Option>
@@ -144,7 +151,9 @@ export default class ModalVouchersComponent extends React.Component {
<div className={'costContainerModal'}>
<div className={'costLeftPaneModal'}>
<p className={'costTitleModal'}>Points</p>
<p className={'costValueModal'}><NumberFormat value={(+this.state.skuPrice).toFixed(0)} displayType={'text'} thousandSeparator={true}/> </p>
<p className={'costValueModal'}>
<NumberFormat value={(+this.state.skuPrice).toFixed(0)} displayType={'text'} thousandSeparator={true}/>
</p>
</div>
<div className={'costRightPaneModal'}>
<Route render={({ history}) => (
@@ -205,38 +214,45 @@ export default class ModalVouchersComponent extends React.Component {
placeholder="Please Select your Option"
optionFilterProp="children"
onChange={(value) => {
console.log({value})
this.setState({selectedOption: value});
this.setState({hidden: 'none'});
// console.log('onChange',value);
const points = item.selectedData.sku.filter(item => item.id == value);
this.setState({
skuName :points[0].name,
skuPrice : points[0].price,
buttonDisbaled:false
skuName : get(data, 'name', '').name,
skuPrice : get(data, 'regular_price', '0.0'),
buttonDisbaled: false
})
}
}
}}
onDropdownVisibleChange={(value) => {
this.setState({hidden: 'inline'})
}}
>
{(item.selectedData.sku || []).map((item, index) => {
{(item.selectedData.sku || [{
vouchers: [{count: +get(data, 'stock', '0.0')}],
price: get(data, 'regular_price', '0.0'),
id: get(data, 'id', ''),
name: get(data, 'name', '')
}]).map((selectedItem, index) => {
// const {vouchers:[{count}]} = item;
console.log({item: selectedItem})
let count = 1;
if (data.source === 'internal') {
count = get(item, 'vouchers[0].count', 0) || 0;
count = get(selectedItem, 'vouchers[0].count', 0) || 0;
}
console.log(count);
const outOfStock = !(+count > 0);
return (
<Option disabled={outOfStock} value={item.id}>
<Option disabled={outOfStock} value={selectedItem.id}>
<div style={{display:'flex',justifyContent:'space-between', width:'100%'}}>
<span>{item.name} {outOfStock ? " - Out of Stock" : ""}</span>
<span>{selectedItem.name} {outOfStock ? " - Out of Stock" : ""}</span>
<span style={{color:'#FF6F00', display:this.state.hidden}}>
Rp. <NumberFormat value={(+item.price).toFixed(0)} displayType={'text'} thousandSeparator={true}/>
Rp. <NumberFormat value={(+selectedItem.price).toFixed(0)} displayType={'text'} thousandSeparator={true}/>
</span>
</div>
</Option>

View File

@@ -59,7 +59,7 @@ export default class PaymentVouchers extends React.Component {
// applicationName = 'BTN';
// applicationLogo = 'http://btn-redemption-2.bangun-kreatif.com/dr6u0fppdi4xy.cloudfront.net/FilesDirectory/Albilad/ImgIconImage/logo-btn.png';
// }
const logoUrl = (this.props.vouchersStore.dataItems.images.logo) ? get(this.vouchersStore.dataItems, 'images.logo', '') : 'http://lorempixel.com/400/200';
const logoUrl = (this.props.vouchersStore.dataItems.images.main) ? get(this.vouchersStore.dataItems, 'images.main', '') : 'http://lorempixel.com/400/200';
let image = logoUrl;
@@ -110,7 +110,7 @@ export default class PaymentVouchers extends React.Component {
{this.props.vouchersStore.dataItems.name} - {this.props.vouchersStore.skuName}
</h3>
<h3 className={'item-points'}>
BTN Points Payment
KB Bukopin Payment
</h3>
</div>
<img className={'image-logo'} src={image} />
@@ -207,18 +207,29 @@ export default class PaymentVouchers extends React.Component {
</Card>
</div>
<div className="row">
<Button type="primary" block onClick={() => {
<Button
type="primary"
block
onClick={() => {
this.globalUI.hideDialogLoading();
this.props.history.push(LINKS.TRANSACTION)
openNotificationWithIcon('success')
return;
this.vouchersStore.buyVoucher(this.vouchersStore.skuId)
.then(res => {
this.globalUI.hideDialogLoading();
this.props.history.push(LINKS.TRANSACTION)
.then(res => {
this.globalUI.hideDialogLoading();
this.props.history.push(LINKS.TRANSACTION)
openNotificationWithIcon('success')
})
.catch(err => {
this.globalUI.openSnackbar(err.message);
console.error(err, 'ini errornya');
});
}}>Pakai Points</Button>
})
.catch(err => {
this.globalUI.openSnackbar(err.message);
console.error(err, 'ini errornya');
});
}}
>
Pakai Points
</Button>
</div>
</div>
<div className="col s0 m2 l2" />

View File

@@ -9,7 +9,7 @@
@media(min-width: 1000px){
.image-logo{
width: 10vw;
height: 10vh;
height: 35vh;
}
.item-container{

View File

@@ -67,6 +67,23 @@ export class VoucherStepper extends React.Component {
content: 'Sistem akan langsung memotong point anda ketika anda menekan tombol konfirmasi dibawah.',
onOk: () => {
this.globalUI.showDialogLoading();
const openNotificationWithIcon = (type) => {
notification[type]({
message: 'Berhasil',
description: `Selamat anda telah mendapatkan vouchers ${this.vouchersStore.dataItems.name} - ${this.vouchersStore.skuName}`,
placement:'topRight',
duration: 5,
});
};
this.globalUI.hideDialogLoading();
// this.props.history.push(LINKS.TRANSACTION)
openNotificationWithIcon('success');
this.setState({
stepIndex: stepIndex + 1,
finished: stepIndex >= 2,
});
return;
this.vouchersStore.buyVoucher(this.vouchersStore.skuId)
.then(res => {
const openNotificationWithIcon = (type) => {

View File

@@ -8,12 +8,14 @@
}
.itemCard{
background-color: #eee;
background-color: white;
border: #ccc 1px solid;
width: 100%;
height: 200px;
display: flex;
flex-direction: column;
justify-content: center;
text-align: center;
align-items: center;
margin-bottom: 10px;
cursor: pointer;
@@ -21,7 +23,7 @@
.imageCard{
width: 120px;
max-height: 60px;
max-height: 100px;
}
.titleCard{

View File

@@ -19,13 +19,66 @@ export default class ModalTopupComponent extends React.Component {
inputCode2: '',
inputCode3: '',
inputCode4: '',
confirmLoading: false
confirmLoading: false,
onOk: {}
};
this.defaultState = Object.assign({}, this.state);
}
componentDidMount() {}
redeemCode (code) {
const codeList = [
{
code: 'MLXNAPNU18nd0871',
amount: 10000
},
{
code: 'ABAKO1239KLKHASD',
amount: 20000
},
{
code: 'W54VCZJN23FGSDAG',
amount: 50000
},
{
code: '123456789ABCEFGH',
amount: 100000
}
]
let rightCode = {};
codeList.map((cl) => {
if (cl.code === code){
rightCode = cl
}}
)
this.setState({
inputCode1: '',
inputCode2: '',
inputCode3: '',
inputCode4: ''
});
if (rightCode.code){
message.success("Voucher redeem success");
this.props.appstate.wallet.data.wallet = this.props.appstate.wallet.data.wallet + rightCode.amount
this.setState({
confirmLoading: false
});
this.state.onOk()
}else{
this.setState({
confirmLoading: false
});
message.warning("Voucher redeem failed")
}
}
render() {
const {data, isVisible = false, onOk = () => {}, onCancel = () => {}, title='Redeem your code'} = this.props;
@@ -35,25 +88,29 @@ export default class ModalTopupComponent extends React.Component {
visible={isVisible}
onOk={async () => {
this.setState({
confirmLoading: true
confirmLoading: true,
onOk: onOk()
});
let voucherCode = this.state.inputCode1 + this.state.inputCode2 + this.state.inputCode3 + this.state.inputCode4;
console.log("voucherCode", voucherCode)
try {
await this.props.appstate.wallet.redeemVoucherCode(voucherCode);
this.props.onOk();
message.info("Voucher redeem success");
} catch (e) {
message.error(e.message);
} finally {
this.setState({
inputCode1: '',
inputCode2: '',
inputCode3: '',
inputCode4: '',
confirmLoading: false
});
}
this.redeemCode(voucherCode)
// try {
// await this.props.appstate.wallet.redeemVoucherCode(voucherCode);
// this.props.onOk();
// message.info("Voucher redeem success");
// } catch (e) {
// message.error(e.message);
// } finally {
// this.setState({
// inputCode1: '',
// inputCode2: '',
// inputCode3: '',
// inputCode4: '',
// confirmLoading: false
// });
// }
}}
onCancel={() => {

View File

@@ -178,7 +178,7 @@ export default class Routes extends React.Component {
<Route exact path={LINKS.INVITE_CONFIRMATION_LOGIN} component={InviteConfirmationLoginComponent}/>
<Route exact path={LINKS.ACCEPT_INVITE} component={AcceptInvite}/>
<Route path={LINKS.CHANGE_PASSWORD} component={ChangePassword}/>
<PrivateRoute path={LINKS.APP_CONTAINER} component={AppContainer}/>
<Route path={LINKS.APP_CONTAINER} component={AppContainer}/>
</Switch>
</Router>
);

View File

@@ -5,7 +5,7 @@ export class ItemStore extends BaseStore {
@observable listImages = [];
constructor(context) {
super(context);
this.url = "items";
this.url = "/categories/11936220-31f7-4f5e-8555-9110dbec4a5d/items";
}
@action

View File

@@ -26,7 +26,7 @@ export default class Vouchers {
getList(){
console.log('res');
this.isLoading = true;
return this.http.get("items")
return this.http.get("categories/11936220-31f7-4f5e-8555-9110dbec4a5d/items")
.then(res => {
this.list = res.data;
this.isLoading = false;

View File

@@ -7,7 +7,7 @@
body {
-webkit-font-smoothing: antialiased !important;
background-color: #f1f5f9;
background-color: #FEFAF0;
text-transform: none;
padding-top: 56px;
font-family: 'Montserrat', "Avenir Next W01", "Proxima Nova W01", "Rubik", -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

View File

@@ -57,7 +57,7 @@ module.exports = {
test: /\.sass?$/,
use: 'happypack/loader?id=styles'
}, {
test: /\.(jpg|png)$/,
test: /\.(jpg|jpeg|png|gif)$/,
loaders: [
'url-loader?limit=10000&publicPath=static/' // Any png-image or woff-font below or equal to 10K will be converted to inline base64 instead
]

View File

@@ -47,7 +47,7 @@ module.exports = {
test: /\.sass?$/,
use: 'happypack/loader?id=styles'
}, {
test: /\.(jpg|png)$/,
test: /\.(jpg|jpeg|png|gif)$/,
loaders: [
'url-loader?limit=10000&publicPath=dist/' // Any png-image or woff-font below or equal to 10K will be converted to inline base64 instead
]