= ({ control }) => {
{wordStickerText}
(
diff --git a/src/features/setting/constants.ts b/src/features/setting/constants.ts
index d957670..f3d7f66 100644
--- a/src/features/setting/constants.ts
+++ b/src/features/setting/constants.ts
@@ -1,9 +1,48 @@
export const colorset = ['red', 'yellow', 'green'];
export const stickerList = ['mood_BAD', 'mood_GOOD'];
-export const previewTitleText = 'What is the Active Setting?';
+export const previewTitleText = 'What is the Active Mood?';
export const previewSubText =
- 'Congratulations on winning! Press the button to get a giftCongratulations on winning! Press the button to get a giftCongratulations on winning!';
+ 'Express yourself on your employee ID card with your day that changes every day! You can write down what you want to say in words and choose a sticker that expresses your day and combine it!';
-export const wordTitleText = 'Word of the day';
-export const wordStickerText = 'Word of the Sticker';
+export const wordTitleText = 'I feel like';
+export const wordStickerText = 'Today’s mood is';
+
+export const esls = [
+ {
+ labelId: '085C1B1FE1D7',
+ productId: 'JC000001',
+ productName: 'test_product_1',
+ },
+ {
+ labelId: '085C1B25E1DE',
+ productId: 'JC000002',
+ productName: 'test_product_2',
+ },
+ {
+ labelId: '085C1B45E1D8',
+ productId: 'JC000003',
+ productName: 'test_product_3',
+ },
+ {
+ labelId: '085C1B47E1DA',
+ productId: 'JC000004',
+ productName: 'test_product_4',
+ },
+ {
+ labelId: '085C1B46E1DB',
+ productId: 'JC000005',
+ productName: 'test_product_5',
+ },
+];
+
+export const labelsImagePushPath =
+ 'https://stage00.common.solumesl.com/common/api/v2/common/labels/image?company=JC01&store=1111';
+
+export const token =
+ 'eyJhbGciOiJSUzI1NiIsImtpZCI6Ilg1ZVhrNHh5b2pORnVtMWtsMll0djhkbE5QNC1jNTdkTzZRR1RWQndhTmsiLCJ0eXAiOiJKV1QifQ.eyJpZHAiOiJMb2NhbEFjY291bnQiLCJvaWQiOiI3ZjViOTAxNy04ZDU0LTQ4OTYtYTZhNi03ZDQxMGM1MmJiMzAiLCJzdWIiOiI3ZjViOTAxNy04ZDU0LTQ4OTYtYTZhNi03ZDQxMGM1MmJiMzAiLCJuYW1lIjoiMTNwZnQxMyIsIm5ld1VzZXIiOmZhbHNlLCJleHRlbnNpb25fQWRtaW5BcHByb3ZlZCI6dHJ1ZSwiZXh0ZW5zaW9uX0N1c3RvbWVyQ29kZSI6IkpDMDEiLCJleHRlbnNpb25fQ3VzdG9tZXJMZXZlbCI6IjEiLCJlbWFpbHMiOlsiMTNwZnQxM0BnbWFpbC5jb20iXSwidGZwIjoiQjJDXzFfUk9QQ19BdXRoIiwiYXpwIjoiZTA4ZTU0ZmYtNWJiMS00YWU3LWFmZGUtYjljZGM4ZmEyM2FlIiwidmVyIjoiMS4wIiwiaWF0IjoxNjkyNDI0NTg5LCJhdWQiOiJlMDhlNTRmZi01YmIxLTRhZTctYWZkZS1iOWNkYzhmYTIzYWUiLCJleHAiOjE2OTI1MTA5ODksImlzcyI6Imh0dHBzOi8vc29sdW1iMmMuYjJjbG9naW4uY29tL2IwYzhlM2Q5LTA4ZmEtNDg3YS1hZmYxLTg1YmFlMTFmYzZjNS92Mi4wLyIsIm5iZiI6MTY5MjQyNDU4OX0.Zd_GeM7C8p03XKMH8gpo3QjeADeY6CW7t3ZLUA3V9NeF6sgHuf_nZGuT46L_9eca1JcbmrIZK1KbCyfVScSaRXhgQ71r627bC05NcJcxNHnsUGSBtihngLvegSNiyC_i7uARyIyEumYasMIUAyuHzVg5PrAyokgb_nY6WfkL2_6yyK5yHf1uNmEZkY-Kq_C4qhn_uplc3KWhXyLwKC_9dDT6ZF0_kBPowok87tAThH4VZNniWcxcTABHEMD9aNeIsCr9axUwU_J9yuMgF9OtKkTWZkWrvLcc8sEKYbGfyvxhtQ2AzyOHKg8re32S5YEVgvTcXVyFng5gIo-_WUm6Zg';
+
+export const dummyEsl = esls[1];
+
+export const width = 250;
+export const height = 122;
diff --git a/src/features/setting/hooks/useSetting.ts b/src/features/setting/hooks/useSetting.ts
index a90b551..ea7a780 100644
--- a/src/features/setting/hooks/useSetting.ts
+++ b/src/features/setting/hooks/useSetting.ts
@@ -1,23 +1,85 @@
import { useForm, SubmitHandler } from 'react-hook-form';
import { useNavigate } from 'react-router-dom';
+import axios from 'axios';
+import { useMutation } from '@tanstack/react-query';
import { Inputs } from '../types';
import { URL } from '../../shared/constants/url';
+import goodMood from '/png/badge_good.png';
+import badMood from '/png/badge_bad.png';
+
+import { dummyEsl, labelsImagePushPath, token } from '../constants';
+
const useSetting = () => {
const { register, handleSubmit, control } = useForm({
defaultValues: {
- mude: '',
+ mood: '',
comment: '',
},
});
const navigate = useNavigate();
- const onSubmit: SubmitHandler = (data) => console.log(data);
+ const onSubmit: SubmitHandler = async (data) => {
+ const imgEl = document.createElement('img');
+ imgEl.src = data.mood === 'mood_GOOD' ? goodMood : badMood; //TODO 이래도 될까
+
+ fetch(imgEl.src)
+ .then((res) => {
+ console.log('res', res);
+ return res.blob();
+ })
+ .then((blob) => {
+ console.log('blob', blob);
+ const reader = new FileReader();
+ reader.readAsDataURL(blob);
+ reader.onloadend = async () => {
+ if (typeof reader.result === 'string') {
+ mutation.mutate({ img: reader.result });
+ }
+ };
+ });
+ };
const handlePreviewClick = () => {
navigate(URL.preview);
};
+ const mutation = useMutation({
+ mutationFn: async ({ img }: { img: string }) => {
+ console.log('mutate img', img);
+ axios.defaults.headers.common['Authorization'] = `Bearer ${token}`;
+ const res = await axios.post(
+ labelsImagePushPath,
+ {
+ labelCode: dummyEsl.labelId,
+ page: 1,
+ frontPage: 1,
+ image: img.split(',')[1],
+ articleList: [
+ {
+ articleId: dummyEsl.productId,
+ articleName: dummyEsl.productName,
+ nfcUrl: 'http://www.solumesl.com',
+ data: {
+ ARTICLE_ID: dummyEsl.productId,
+ ARTICLE_NAME: dummyEsl.productName,
+ NFC_URL: 'http://www.solum.com/p/JC000001',
+ SALE_PRICE: '$100',
+ DISCOUNT_PRICE: '$90',
+ },
+ },
+ ],
+ },
+ {
+ headers: {
+ 'Content-Type': `application/json; charset=utf-8 `,
+ },
+ },
+ );
+ console.log(res);
+ },
+ });
+
return {
register,
handleSubmit,
diff --git a/src/features/setting/types.ts b/src/features/setting/types.ts
index 94daf16..696ecf6 100644
--- a/src/features/setting/types.ts
+++ b/src/features/setting/types.ts
@@ -1,4 +1,4 @@
export type Inputs = {
- mude: string;
+ mood: string;
comment: string;
};