钥匙分享
This commit is contained in:
parent
acdb0999da
commit
e54344328f
|
|
@ -134,6 +134,7 @@ const NormaIndex: React.FC = () => {
|
|||
|
||||
const response = await apiService.getDeviceList();
|
||||
|
||||
|
||||
if (response?.code == 200 && response.data) {
|
||||
const defaultDev = response.data.find((device: DeviceType) => device.isDefault == 1);
|
||||
if (defaultDev) {
|
||||
|
|
@ -148,7 +149,7 @@ const NormaIndex: React.FC = () => {
|
|||
try {
|
||||
|
||||
const response = await apiService.getDeviceList();
|
||||
|
||||
console.log(response,'response');
|
||||
if (response?.code === 200 && response.data) {
|
||||
const defaultDev = response.data.find((device: DeviceType) => device.isDefault == 1);
|
||||
if (defaultDev) {
|
||||
|
|
|
|||
|
|
@ -1,9 +1,10 @@
|
|||
import React from 'react';
|
||||
import React, { useState, useEffect } from 'react';
|
||||
import { StyleSheet, View, Image, TouchableOpacity, Modal } from 'react-native';
|
||||
import { Layout, Text, Avatar, Button, TopNavigation, TopNavigationAction, Icon, Card } from '@ui-kitten/components';
|
||||
import { rpx } from '../../utils/rpx';
|
||||
import { useNavigation, useRoute } from '@react-navigation/native';
|
||||
import { apiService } from '../../utils/api';
|
||||
import Toast from 'react-native-toast-message';
|
||||
|
||||
interface KeyItem {
|
||||
keyId: string;
|
||||
|
|
@ -16,136 +17,173 @@ interface KeyItem {
|
|||
}
|
||||
|
||||
const BackIcon = (props) => (
|
||||
<Icon
|
||||
{...props}
|
||||
name='arrow-back'
|
||||
/>
|
||||
<Icon {...props} name='arrow-back' />
|
||||
);
|
||||
|
||||
const KeyDetail = () => {
|
||||
const navigation = useNavigation();
|
||||
const route = useRoute();
|
||||
const keyItem = route.params?.keyItem as KeyItem;
|
||||
const [visible, setVisible] = React.useState(false);
|
||||
const [showTimeModal, setShowTimeModal] = React.useState(false);
|
||||
const [selectedTime, setSelectedTime] = React.useState('');
|
||||
const keyId = route.params?.keyItem.keyId;
|
||||
const [keyItem, setKeyItem] = useState<KeyItem | null>(null);
|
||||
const [visible, setVisible] = useState(false);
|
||||
const [showTimeModal, setShowTimeModal] = useState(false);
|
||||
const [selectedTime, setSelectedTime] = useState('');
|
||||
const [isLoading, setIsLoading] = useState(false);
|
||||
const timeOptions = ['1天', '7天', '30天', '永久'];
|
||||
|
||||
const showDeleteModal = () => {
|
||||
setVisible(true);
|
||||
};
|
||||
|
||||
const hideDeleteModal = () => {
|
||||
setVisible(false);
|
||||
|
||||
};
|
||||
|
||||
const handleDelete = () => {
|
||||
// 这里添加删除逻辑
|
||||
hideDeleteModal();
|
||||
apiService.deleteKey(keyItem.keyId).then(res => {
|
||||
console.log(res,'resresres');
|
||||
if (res.code == 200) {
|
||||
navigation.goBack();
|
||||
// 获取钥匙详情
|
||||
const fetchKeyInfo = async () => {
|
||||
try {
|
||||
setIsLoading(true);
|
||||
const response = await apiService.getKeyInfo(keyId);
|
||||
if (response.code === 200 && response.data) {
|
||||
setKeyItem(response.data);
|
||||
} else {
|
||||
Toast.show({
|
||||
type: 'error',
|
||||
text1: '获取钥匙信息失败',
|
||||
});
|
||||
}
|
||||
});
|
||||
} catch (error) {
|
||||
console.error('获取钥匙信息错误:', error);
|
||||
Toast.show({
|
||||
type: 'error',
|
||||
text1: '获取钥匙信息失败',
|
||||
});
|
||||
} finally {
|
||||
setIsLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
const navigateBack = () => {
|
||||
navigation.goBack();
|
||||
// 组件挂载和 keyId 变化时获取数据
|
||||
useEffect(() => {
|
||||
if (keyId) {
|
||||
fetchKeyInfo();
|
||||
}
|
||||
}, [keyId]);
|
||||
|
||||
const showDeleteModal = () => setVisible(true);
|
||||
const hideDeleteModal = () => setVisible(false);
|
||||
|
||||
const handleDelete = async () => {
|
||||
try {
|
||||
setIsLoading(true);
|
||||
const res = await apiService.deleteKey(keyId);
|
||||
if (res.code === 200) {
|
||||
Toast.show({
|
||||
type: 'success',
|
||||
text1: '删除成功',
|
||||
});
|
||||
navigation.goBack();
|
||||
} else {
|
||||
Toast.show({
|
||||
type: 'error',
|
||||
text1: res.msg || '删除失败',
|
||||
});
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('删除钥匙错误:', error);
|
||||
Toast.show({
|
||||
type: 'error',
|
||||
text1: '删除失败',
|
||||
});
|
||||
} finally {
|
||||
setIsLoading(false);
|
||||
hideDeleteModal();
|
||||
}
|
||||
};
|
||||
|
||||
const handleTimeSelect = (time: string) => {
|
||||
const handleTimeSelect = async (time: string) => {
|
||||
setSelectedTime(time);
|
||||
|
||||
// 将中文时间选项转换为天数
|
||||
if (!keyItem) return;
|
||||
|
||||
let days = 0;
|
||||
switch (time) {
|
||||
case '1天':
|
||||
days = 1;
|
||||
break;
|
||||
case '7天':
|
||||
days = 7;
|
||||
break;
|
||||
case '30天':
|
||||
days = 30;
|
||||
break;
|
||||
case '永久':
|
||||
// 设置为100年
|
||||
days = 36500;
|
||||
break;
|
||||
case '1天': days = 1; break;
|
||||
case '7天': days = 7; break;
|
||||
case '30天': days = 30; break;
|
||||
case '永久': days = 36500; break;
|
||||
}
|
||||
|
||||
// 基于创建时间计算新的过期时间
|
||||
const baseDate = new Date(keyItem.createTime);
|
||||
const newExpirationDate = new Date(baseDate.getTime() + days * 24 * 60 * 60 * 1000);
|
||||
|
||||
// 设置时间为23:59:59
|
||||
newExpirationDate.setHours(23);
|
||||
newExpirationDate.setMinutes(59);
|
||||
newExpirationDate.setSeconds(59);
|
||||
|
||||
// 格式化日期为 YYYY-MM-DD HH:mm:ss
|
||||
const formattedDate = newExpirationDate.getFullYear() + '-' +
|
||||
String(newExpirationDate.getMonth() + 1).padStart(2, '0') + '-' +
|
||||
String(newExpirationDate.getDate()).padStart(2, '0') + ' ' +
|
||||
String(newExpirationDate.getHours()).padStart(2, '0') + ':' +
|
||||
String(newExpirationDate.getMinutes()).padStart(2, '0') + ':' +
|
||||
String(newExpirationDate.getSeconds()).padStart(2, '0');
|
||||
console.log(formattedDate,'formattedDate');
|
||||
// 调用API更新过期时间
|
||||
const data = {
|
||||
keyId: keyItem.keyId,
|
||||
expirationTime: formattedDate
|
||||
};
|
||||
apiService.updateKey(data).then(res => {
|
||||
console.log(res,'resresres');
|
||||
|
||||
try {
|
||||
setIsLoading(true);
|
||||
const res = await apiService.updateKey({
|
||||
keyId: keyId,
|
||||
expirationTime: formattedDate
|
||||
});
|
||||
|
||||
if (res.code === 200) {
|
||||
// 更新成功后关闭模态框
|
||||
setShowTimeModal(false);
|
||||
// 可以添加成功提示或刷新页面的逻辑
|
||||
Toast.show({
|
||||
type: 'success',
|
||||
text1: '更新成功',
|
||||
});
|
||||
// 更新成功后重新获取钥匙信息
|
||||
await fetchKeyInfo();
|
||||
} else {
|
||||
Toast.show({
|
||||
type: 'error',
|
||||
text1: res.msg || '更新失败',
|
||||
});
|
||||
}
|
||||
});
|
||||
} catch (error) {
|
||||
console.error('更新钥匙有效期错误:', error);
|
||||
Toast.show({
|
||||
type: 'error',
|
||||
text1: '更新失败',
|
||||
});
|
||||
} finally {
|
||||
setIsLoading(false);
|
||||
setShowTimeModal(false);
|
||||
}
|
||||
};
|
||||
|
||||
const navigateBack = () => navigation.goBack();
|
||||
const BackAction = () => (
|
||||
<TopNavigationAction
|
||||
icon={BackIcon}
|
||||
onPress={navigateBack}
|
||||
/>
|
||||
<TopNavigationAction icon={BackIcon} onPress={navigateBack} />
|
||||
);
|
||||
|
||||
const calculateRemainingTime = (expirationTime: string): string => {
|
||||
const now = new Date();
|
||||
const expiration = new Date(expirationTime);
|
||||
const diffTime = expiration.getTime() - now.getTime();
|
||||
|
||||
// 如果已过期
|
||||
if (diffTime <= 0) {
|
||||
return '已过期';
|
||||
}
|
||||
if (diffTime <= 0) return '已过期';
|
||||
|
||||
// 计算剩余天数、小时、分钟
|
||||
const days = Math.floor(diffTime / (1000 * 60 * 60 * 24));
|
||||
const hours = Math.floor((diffTime % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
|
||||
const minutes = Math.floor((diffTime % (1000 * 60 * 60)) / (1000 * 60));
|
||||
|
||||
if (days > 0) {
|
||||
return `${days}天${hours}小时`;
|
||||
} else if (hours > 0) {
|
||||
return `${hours}小时${minutes}分钟`;
|
||||
} else {
|
||||
return `${minutes}分钟`;
|
||||
}
|
||||
if (days > 0) return `${days}天${hours}小时`;
|
||||
if (hours > 0) return `${hours}小时${minutes}分钟`;
|
||||
return `${minutes}分钟`;
|
||||
};
|
||||
|
||||
const RightIcon = (props: any) => (
|
||||
<Image
|
||||
source={{ uri: 'https://lxnapi.ccttiot.com/bike/img/static/uGq4yJlU1ZZRkwiJ8Y74' }}
|
||||
style={styles.arrowIcon}
|
||||
/>
|
||||
);
|
||||
|
||||
const toQrCode = () => {
|
||||
navigation.navigate('ShareQrcode', { QrId: keyItem.keyId });
|
||||
navigation.navigate('ShareQrcode', { QrId: keyId });
|
||||
};
|
||||
|
||||
return (
|
||||
<Layout style={styles.container}>
|
||||
<TopNavigation
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user