Skip to content

Commit b4ed5bf

Browse files
authored
Merge pull request #16 from KaguraMei/main
2 parents 1057b6d + 3f0215a commit b4ed5bf

File tree

5 files changed

+112
-0
lines changed

5 files changed

+112
-0
lines changed

public/images/a_liitle_tea.png

176 KB
Loading
41.1 KB
Loading

public/images/icons/a_liitle_tea.png

176 KB
Loading

src/pages/tools/alittletea.tsx

Lines changed: 104 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,104 @@
1+
import { QRCode } from "antd";
2+
import dayjs from 'dayjs'
3+
import HighText from "../../components/HighText";
4+
import { useOutletContext } from "react-router-dom";
5+
import { RefObject } from "react";
6+
import BaseCard from "../../components/BaseCard";
7+
export default function AlittleTea() {
8+
const [highLight, ref]:[highLight: boolean, ref: RefObject<HTMLDivElement>] = useOutletContext();
9+
10+
return (
11+
<div>
12+
<BaseCard ref={ref}>
13+
<div bg='white' className='w-70 z-0 relative px-6 py-4 rounded-5 ' >
14+
{/* LOGO */}
15+
<img src="/images/alittle-tea.png" alt="logo" absolute w-10 h-auto right-4 top-4 op80 />
16+
17+
{/* 基础信息区域 */}
18+
<div text='xs' className='z-10'>
19+
<HighText show={highLight} text='数量' eg='1/1' />
20+
</div>
21+
22+
{/* 点单来源 */}
23+
<div flex='~ items-center'>
24+
<div mt-1 text='xl' style={{marginRight: '10px'}}>
25+
<HighText show={highLight} text='点单来源' eg='饿了么' />
26+
</div>
27+
<div font='bold' mt-1 text='xl' >
28+
<HighText show={highLight} text='编号' eg='B860' /></div>
29+
</div>
30+
31+
{/* 杯子大小,冷热度,糖度什么的 */}
32+
<div flex='~ items-center' className=''>
33+
<div text='md'>
34+
<HighText show={highLight} text='杯子大小' eg='大杯' />
35+
36+
<HighText show={highLight} text='冷热度' eg='少冰'/>
37+
/
38+
<HighText show={highLight} text='糖度' eg='三分糖' />
39+
40+
</div>
41+
</div>
42+
43+
{/* 产品名称区域 */}
44+
<div text='xl' font='bold' >
45+
<HighText show={highLight} text='产品名称' eg='叙拉古人的愤怒' />
46+
</div>
47+
48+
{/* 自定义区域 */}
49+
<div flex='~ items-center' >
50+
<div text='md'>
51+
<HighText show={highLight} text='加料1' eg='仙草' />
52+
<HighText show={highLight} text='加料2' eg='/改牛乳' />
53+
<HighText show={highLight} text='加料3' eg='/冰糖' />
54+
</div>
55+
</div>
56+
57+
{/* 价格区域 */}
58+
<div flex='~ items-center' className='mt-1'>
59+
<div text='xl'>
60+
61+
<HighText show={highLight} text='价格' eg='12' />
62+
</div>
63+
</div>
64+
65+
{/* 时间区域 */}
66+
<div text='sm'>
67+
<HighText show={highLight} text='日期时间' eg={dayjs().format('YYYY-MM-DD HH:mm:ss')} />
68+
</div>
69+
70+
{/* 店铺信息区域 */}
71+
<div flex='~ items-center' className='mt-1'>
72+
<div text='xs' style={{marginRight: '25px'}}>
73+
<HighText show={highLight} text='店铺名称' eg='漕河泾印象城店' />
74+
</div>
75+
<div text='xs' style={{marginTop: '0.5px'}}>
76+
<HighText show={highLight} text='店铺号码' eg='3284856' />
77+
</div>
78+
</div>
79+
80+
{/* 建议区域 */}
81+
<div flex='~ items-center' className='mt-1 ' style={{fontSize: 14, fontWeight: 300, letterSpacing: '1px'}}>
82+
建议1小时内饮用完毕,口感最佳
83+
</div>
84+
85+
{/* 特别信息 */}
86+
<div text='sm balck' font='bold' mt-2 tracking-widest style={{marginTop: '30px'}}>
87+
<HighText show={highLight} text='特别信息' eg='入会享88折,趣开1点点订制专属您的饮品' />
88+
</div>
89+
<div mt-1 flex='~ justify-between'>
90+
<div>
91+
92+
93+
<div >
94+
<img src="/images/a_little_tea_sticker.png" alt="logo" style={{marginLeft: '-5px', width: '130px', height: '55px'}} />
95+
</div>
96+
97+
</div>
98+
<QRCode value={'https://sticker.hsott.cn'} style={{marginTop: '-30px'}} bordered={false} className="-m-3 mt-[-10px] " size={100} color='black' type={'svg'} />
99+
</div>
100+
</div>
101+
</BaseCard>
102+
</div>
103+
)
104+
}

src/utils/router.ts

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,14 @@ const list = {
1919
tag: '热门',
2020
tag_color: hot
2121
},
22+
{
23+
name: ['一点点', '奶茶标签'],
24+
logo: '/images/alittle-tea.png',
25+
url: '/tools/alittletea',
26+
color: ['#F1A050', '#F3AA3C'],
27+
tag: '新上线',
28+
tag_color: ['#dcfce7', '#16a34a']
29+
},
2230
{
2331
name: ['人生四格', '2x2版 106mm*156mm(含3mm出血)'],
2432
logo: '/images/icons/rssg-2.webp',

0 commit comments

Comments
 (0)