54 lines
1.9 KiB
TypeScript
54 lines
1.9 KiB
TypeScript
import { useEffect, useState } from 'react';
|
|
import { View, Text } from '@tarojs/components';
|
|
import '../../styles/redeem.css';
|
|
import Taro from '@tarojs/taro';
|
|
import PageShell from '../../components/PageShell';
|
|
import SubPageHeader from '../../components/SubPageHeader';
|
|
import ContactCsButton from '../../components/ContactCsButton';
|
|
import { toast } from '../../lib/api';
|
|
import { getBrandAssetsSync, loadBrandAssets } from '../../lib/brand-assets';
|
|
|
|
const isWeapp = process.env.TARO_ENV === 'weapp';
|
|
|
|
function dialPhone(phone: string) {
|
|
const tel = phone.replace(/-/g, '');
|
|
Taro.makePhoneCall({ phoneNumber: tel }).catch(() => toast('无法拨打电话'));
|
|
}
|
|
|
|
export default function CustomerServicePage() {
|
|
const [phone, setPhone] = useState(() => getBrandAssetsSync().customerServicePhone);
|
|
|
|
useEffect(() => {
|
|
void loadBrandAssets().then((b) => setPhone(b.customerServicePhone));
|
|
}, []);
|
|
|
|
return (
|
|
<PageShell variant="sub" className="cs-page">
|
|
<SubPageHeader title="联系客服" />
|
|
<View className="sub-page-body inset-page cs-body">
|
|
<Text className="cs-brand">杜康好客客服</Text>
|
|
<Text className="cs-hint">
|
|
{isWeapp
|
|
? '点击下方按钮，进入小程序在线客服会话'
|
|
: '请在微信小程序内打开以使用在线客服，或拨打客服电话'}
|
|
</Text>
|
|
<Text className="cs-hours">工作时间：9:00 - 21:00</Text>
|
|
|
|
{isWeapp ? (
|
|
<ContactCsButton className="cs-online-btn" session={{ from: 'customer-service' }} />
|
|
) : null}
|
|
|
|
<View className={isWeapp ? 'cs-phone-link' : 'cs-call-btn'} onClick={() => dialPhone(phone)}>
|
|
<Text>
|
|
{isWeapp ? `或拨打客服电话 ${phone}` : '拨打客服电话'}
|
|
</Text>
|
|
</View>
|
|
|
|
{!isWeapp ? (
|
|
<Text className="cs-phone-display">{phone}</Text>
|
|
) : null}
|
|
</View>
|
|
</PageShell>
|
|
);
|
|
}
|