Commit 3de88d4d authored by 赵振东's avatar 赵振东

Merge branch 'v2-test' into 'v2-test'

V2 test See merge request project/gaohuaxue-mobile-app!42
parents 73af939e 3136a857
import React, { useEffect, useState } from 'react';
import React, { useEffect, useMemo, useRef, useState } from 'react';
import { USER_INFO } from '../constants';
import { roleType } from '../store/userStore';
import { getCurrentRole } from '../utils/curentRole';
import { getAsyncStorage } from '../utils/storage';
import { useStores } from './useStores';
type roles = {
roleId: number;
......@@ -11,16 +12,12 @@ type roles = {
};
export const useCurrentRole = () => {
const [role, setRole] = useState<roles>();
useEffect(() => {
const getRole = async () => {
try {
const _USER_INFO = await getAsyncStorage(USER_INFO);
const currentRole = getCurrentRole(_USER_INFO);
setRole(currentRole);
} catch {}
};
getRole();
const roleRef = useRef<any>({});
const { userStore } = useStores();
useMemo(() => {
const currentRole = getCurrentRole(userStore.userInfo!);
roleRef.current = currentRole;
}, []);
return { role };
return { role: roleRef.current };
};
......@@ -30,6 +30,7 @@ import CheckInquiryOrder from '../views/CheckInquiryOrder';
import InquiryOrderDetail from '../views/CheckInquiryOrder/pages/InquiryOrderDetail';
import EnsureInquiryOrder from '../views/EnsureInquiryOrder';
import CheckQuotationOrder from '../views/CheckQuotationOrder';
import StatusLayout from '../views/StatusLayout';
export const ROUTERS = {
Login: {
......@@ -186,4 +187,9 @@ export const ROUTERS = {
component: FeedbackGlo,
headerShown: false,
},
StatusLayout: {
title: '审批状态组件',
component: StatusLayout,
headerShown: false,
},
};
......@@ -11,8 +11,8 @@ export class UserStore {
constructor() {
makeObservable(this, {
username: observable,
userInfo: observable,
setUsername: action,
// setUserInfo: action.bound,
setUserInfo: flow,
removeUserInfo: flow,
});
......
......@@ -14,8 +14,9 @@ const AccountInfo: React.FC<any> = ({ navigation }) => {
const [currentAI, setCurrentAI] = useState([]);
useEffect(() => {
const { name, phone, orgName } = userStore.userInfo;
const _role = getCurrentRole(userStore.userInfo);
console.log(userStore, 'userStoreuserStoreuserStoreuserStore');
const { name, phone, orgName } = userStore?.userInfo;
const _role = getCurrentRole(userStore?.userInfo);
setCurrentAI([
{ title: '姓名', value: name },
{ title: '账号', value: phone },
......
import React, { useRef, useEffect, useState } from 'react';
import { View, Text, FlatList } from 'react-native';
import { View, Text, FlatList, TouchableOpacity } from 'react-native';
import useAppStyle from '../../hooks/useAppStyle';
import styles from './styles';
import useLocale from '../../hooks/useLocale';
......@@ -9,6 +9,7 @@ import {
getTransactionMobileInquiryAddList,
GetTransactionMobileInquiryAddListResponseDetail as DataType,
GetTransactionMobileInquiryAddListRequest as ParamType,
getTransactionMobileProductInquiryList,
} from '../../services/TransactionV2Api';
import InquiryOrderItem from './components/InquiryOrderItem';
import FilterModal from '../RequireOrder/components/FilterModal';
......@@ -20,6 +21,7 @@ import { FilterBarType } from '../RequireOrder';
import { useCurrentRole } from '../../hooks/useCurrentRole';
import { roleType } from '../../store/userStore';
import { formatDateToTime } from '../../utils/date';
import { navigate } from '../../routers/RootNavigation';
const CheckInquiryOrder = () => {
const myStyle = useAppStyle(styles);
......@@ -34,10 +36,13 @@ const CheckInquiryOrder = () => {
});
const [innerValue, setInnerValue] = useState('');
const { role } = useCurrentRole();
console.log(role, 'rolerolerolerole');
const fetchData = async () => {
setLoading(true);
const res = await getTransactionMobileInquiryAddList(searchcriteria);
const api =
role?.roleType === roleType.consumer
? getTransactionMobileInquiryAddList //服务消费者
: getTransactionMobileProductInquiryList; // 服务提供者
const res = await api(searchcriteria); // 服务提供者
setLoading(false);
setHasMore(
checkMore(
......
......@@ -8,28 +8,286 @@ import {
TouchableOpacity,
ScrollView,
FlatList,
Clipboard,
} from 'react-native';
import Toast from 'react-native-root-toast';
import WebView from 'react-native-webview';
import { Iprops } from '../../../../components/Confirm/ConfirmContainer';
import NavBar from '../../../../components/NavBar';
import { FcRoute } from '../../../../global';
import useAppStyle from '../../../../hooks/useAppStyle';
import { useCurrentRole } from '../../../../hooks/useCurrentRole';
import useLocale from '../../../../hooks/useLocale';
import {
getTransactionMobileInquiryListDetails,
getTransactionMobileProductInquiryDetails,
} from '../../../../services/TransactionV2Api';
import { roleType } from '../../../../store/userStore';
import { formatNum } from '../../../../utils/formatNum';
import { RequireOrderStatusEnum } from '../../../RequireOrder/constants';
import styles from './styles';
import Icons from 'react-native-vector-icons/AntDesign';
interface Param {
id: number; //报价单Id
}
const InquiryOrderDetail: FcRoute<'InquiryOrderDetail', Param> = props => {
const {
route: {
// params: { id: xxxx },
},
route: { params },
} = props;
// console.log(id, 'ididididididididididid');
const { t } = useLocale('order');
const myStyle = useAppStyle(styles);
const { role } = useCurrentRole();
const [orderData, setOrderData] = useState<any>();
const fetchData = async () => {
const api =
role?.roleType === roleType.consumer
? getTransactionMobileInquiryListDetails //服务消费者
: getTransactionMobileProductInquiryDetails; // 服务提供者
const { data, code } = await api({ id: params?.id });
setOrderData(data);
};
useEffect(() => {
fetchData();
}, []);
const handleCopy = (text: string) => {
if (!text) {
Toast.show(t('order.tip.noCopy'));
return;
}
Clipboard.setString(text);
Toast.show(t('order.tip.successCopy'));
};
const materialList = [
{
title: '商品ID',
value: 'commodityId',
},
{
title: '采购数量:',
value: 'purchaseCount',
formatNum: true,
},
{
title: '品类:',
value: 'category',
},
{
title: '品牌:',
value: 'brand',
},
{
title: '单位:',
value: 'unit',
},
];
const renderCommonList = (item, index) => (
<View
style={myStyle.CellIem}
// onPress={() => (item.fn ? item.fn() : {})}
key={`${item.title}_${index}`}
>
<Text style={myStyle.CellName}>{t(item.title)}</Text>
<View style={{ flexDirection: 'row' }}>
<Text style={myStyle.CellText} numberOfLines={1}>
{item.value}
</Text>
{item.hasCopy && (
<Text
style={[myStyle.addressName, { marginLeft: 10 }]}
onPress={() => handleCopy(item.value)}
>
{t('order.btn.copy')}
</Text>
)}
</View>
</View>
);
const renderMaterialList = (topItem, topIndex) => {
const Goods: any = orderData?.inquiryListProductRequests?.[topIndex];
return (
<View style={myStyle.Mcell}>
{/* <View style={{ flex: 1 }}>
<WebView source={{ uri: Goods?.imgUrl }} style={{ marginTop: 20 }} />
</View> */}
<View>
<Text style={myStyle['Mcell-title']}>{Goods?.['productName']}</Text>
<FlatList
numColumns={2}
data={materialList}
ItemSeparatorComponent={() => <View style={{ height: 8 }} />}
renderItem={({ item, index }) => {
const { title, value } = item;
return (
<View style={myStyle['Mcell-content']}>
<Text style={myStyle['Mcell-text']}>{title}</Text>
<Text style={{ color: '#252D37' }}>
{item.formatNum
? formatNum(Goods?.[value], 6)
: Goods?.[value]}
</Text>
</View>
);
}}
/>
</View>
</View>
);
};
const basicInfoList = [
{ title: '询价单号', value: orderData?.inquiryListNo, hasCopy: true },
{ title: '询价会员', value: orderData?.inquiryListMemberName },
{ title: '需求摘要', value: orderData?.detail },
{ title: '单据时间', value: orderData?.billTime },
];
const otherConditionList = [
{ title: '报价要求', value: orderData?.offer },
{ title: '付款方式', value: orderData?.paymentType },
{ title: '税费要求', value: orderData?.taxes },
{ title: '物流要求', value: orderData?.logistics },
{ title: '包装要求', value: orderData?.packRequire },
{ title: '其他要求', value: orderData?.otherRequire },
];
const tradeConditionList = [
{ title: '交付时间', value: orderData?.deliveryTime },
{ title: '交付地址', value: orderData?.fullAddress },
{ title: '报价截止时间', value: orderData?.quotationAsTime },
];
return (
<View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
<Text>我是询价单详情</Text>
<View style={myStyle.container}>
<ScrollView>
<NavBar
title=""
backIconColor="white"
customStyle={{ backgroundColor: '#00A990' }}
/>
<View style={myStyle.satus}>
<Text style={myStyle.satusTxet}>
{RequireOrderStatusEnum.getLabelByValue(orderData?.externalState)}
</Text>
<View
style={{
marginLeft: 4,
paddingTop: 4,
}}
>
<Icons color={'#FFFFFF'} size={18} name={'right'} />
</View>
</View>
{/* <Text>我是询价单详情</Text> */}
<View style={{ flexDirection: 'column', paddingHorizontal: 8 }}>
{/* 单号 */}
<View style={myStyle.address}>
<View style={myStyle.addressFlex}>
<View style={myStyle['addressFlex-title']}>
<View style={myStyle.block} />
<Text style={myStyle['addressFlex-title-text']}>
{orderData?.details}
</Text>
</View>
<View style={myStyle.orderNo}>
<Text
style={[
myStyle.addressName,
{ fontSize: 12, marginRight: 10 },
]}
>
{orderData?.inquiryListNo}
</Text>
<Text
style={[myStyle.addressName]}
onPress={() => handleCopy(orderData?.inquiryListNo)}
>
{t('order.btn.copy')}
</Text>
</View>
</View>
</View>
{/* 基本信息 */}
<View style={myStyle.cell}>
<View style={myStyle.HeadCell}>
<Text style={myStyle.HeadCellText}>{'基本信息'}</Text>
</View>
{basicInfoList.map((item, index) => {
if (item.value) {
return renderCommonList(item, index);
}
return false;
})}
</View>
{/* 求购物料 */}
<View style={myStyle.cell}>
<View style={myStyle.HeadCell}>
<Text style={myStyle.HeadCellText}>{'求购物料'}</Text>
</View>
{orderData?.inquiryListProductRequests?.map((item, index) => {
return <>{renderMaterialList(item, index)}</>;
})}
</View>
{/* 交易条件 */}
<View style={myStyle.cell}>
<View style={myStyle.HeadCell}>
<Text style={myStyle.HeadCellText}>{'交易条件'}</Text>
</View>
{tradeConditionList.map((item, index) => {
if (item.value) {
return renderCommonList(item, index);
}
return false;
})}
</View>
{/* 其他条件 */}
<View style={myStyle.cell}>
<View style={myStyle.HeadCell}>
<Text style={myStyle.HeadCellText}>{'其他条件'}</Text>
</View>
{otherConditionList.map((item, index) => {
if (item.value) {
return renderCommonList(item, index);
}
return false;
})}
</View>
{/* 附件 */}
<View style={myStyle.cell}>
<View style={myStyle.HeadCell}>
<Text style={myStyle.HeadCellText}>{'附件'}</Text>
</View>
{orderData?.enclosureUrls?.map((item, index) => {
// console.log(item, 'itemitemitemitemitem');
return (
<>
<TouchableOpacity
// onPress={handlePress}
>
<Text>{item.name}</Text>
</TouchableOpacity>
{/* <View style={{ flex: 1 }}>
<WebView source={{ uri: url }} style={{ marginTop: 20 }} />
</View> */}
</>
);
})}
</View>
{/* -------- */}
</View>
</ScrollView>
</View>
);
};
......
......@@ -9,4 +9,161 @@ export default (theme: ThemeStyle) =>
backgroundColor: '#F4F5F7',
flexDirection: 'column',
},
// Head: {
// paddingVertical: 15,
// paddingHorizontal: 10,
// // padding: 20,
// backgroundColor: '#00A990',
// },
satus: {
height: 80,
paddingVertical: 15,
paddingHorizontal: 10,
backgroundColor: '#00A990',
// alignItems: 'center',
flexDirection: 'row',
},
satusTxet: {
fontSize: 20,
color: '#fff',
fontWeight: '900',
// position: 'relative',
},
// mian: {
// flexDirection: 'column',
// width: '100%',
// paddingBottom: 80,
// },
address: {
width: '100%',
paddingHorizontal: 10,
backgroundColor: '#fff',
borderRadius: 8,
paddingVertical: 12,
alignItems: 'flex-start',
// marginTop: -30,
position: 'relative',
top: -30,
},
addressFlex: {
flexDirection: 'column',
marginLeft: 10,
width: '100%',
},
'addressFlex-title': {
flexDirection: 'row',
// alignItems: 'center',
position: 'relative',
},
block: {
width: 4,
height: 20,
backgroundColor: '#00A98F',
borderRadius: 2,
position: 'absolute',
left: -10,
top: 2,
},
'addressFlex-title-text': {
color: '#303133',
fontSize: 16,
fontWeight: Platform.OS === 'ios' ? '500' : '600',
// marginTop: 16,
marginBottom: 6,
},
orderNo: {
flexDirection: 'row',
alignItems: 'flex-end',
},
addressName: {
// color: 'black',
fontSize: 12,
color: '#252D37',
},
addressText: {
fontSize: 13,
lineHeight: 23,
},
customer: {
position: 'relative',
top: -30,
marginTop: 10,
backgroundColor: '#fff',
justifyContent: 'center',
paddingVertical: 10,
borderRadius: 8,
},
cell: {
position: 'relative',
top: -30,
marginTop: 10,
paddingVertical: 10,
backgroundColor: '#fff',
borderRadius: 8,
paddingHorizontal: 12,
flexDirection: 'column',
},
HeadCell: {
justifyContent: 'space-between',
flexDirection: 'row',
alignItems: 'center',
width: '100%',
marginBottom: 10,
},
CellShow: {
fontSize: 12,
},
HeadCellText: {
fontSize: 14,
color: '#252D37',
fontWeight: Platform.OS === 'ios' ? '500' : '600',
},
CellIem: {
display: 'flex',
flexDirection: 'row',
justifyContent: 'space-between',
// paddingHorizontal: 12,
paddingVertical: 10,
},
cellCard: {
backgroundColor: '#F5F6F7',
borderRadius: 6,
},
cellCardItem: {
width: '100%',
display: 'flex',
justifyContent: 'space-between',
// padding: 5px 10px,
paddingHorizontal: 10,
paddingVertical: 5,
},
CellName: {
fontSize: 14,
color: '#5C626A',
},
CellText: {
maxWidth: 260,
fontSize: 14,
color: '#252D37',
},
Mcell: {
display: 'flex',
marginTop: 10,
justifyContent: 'space-between',
},
'Mcell-title': {
fontWeight: Platform.OS === 'ios' ? '500' : '600',
marginBottom: 8,
// backgroundColor: 'green',
fontSize: 14,
color: '#252D37',
},
'Mcell-content': {
flexDirection: 'row',
// justifyContent: 'space-between',
width: '48%',
},
'Mcell-text': {
marginRight: 5,
},
});
......@@ -34,20 +34,11 @@ const CheckOrderItem = props => {
<>
{label ? (
<View style={myStyle['box-bottome-foot']}>
<TouchableOpacity
onPress={() => {
navigation.navigate('RequirePriceOrderDetail', {
quoteNoId: item?.quoteId,
askPurchaseId: item?.askPurchaseId,
innerStatus: item?.innerStatus,
});
}}
style={myStyle['box-bottome-content-button']}
>
<View style={myStyle['box-bottome-content-button']}>
<Text style={myStyle['box-bottome-content-button-text']}>
{label}
</Text>
</TouchableOpacity>
</View>
</View>
) : null}
</>
......@@ -77,7 +68,16 @@ const CheckOrderItem = props => {
};
return (
<View style={myStyle.box}>
<TouchableOpacity
style={myStyle.box}
onPress={() => {
navigation.navigate('RequirePriceOrderDetail', {
quoteNoId: item?.quoteId,
askPurchaseId: item?.askPurchaseId,
// innerStatus: item?.innerStatus,
});
}}
>
<View style={myStyle['box-top']}>
<Text style={myStyle['box-top-text']}>
报价单号:
......@@ -147,7 +147,7 @@ const CheckOrderItem = props => {
{/* 内部状态:1.待提交审核2.待审核(一级)3.待审核(二级)4.待提交报价单5.审核通过6.审核不通过 */}
{renderButton()}
</View>
</View>
</TouchableOpacity>
);
};
export default CheckOrderItem;
......@@ -53,7 +53,16 @@ const CheckOrderItem = props => {
};
return (
<View style={myStyle.box}>
<TouchableOpacity
style={myStyle.box}
onPress={() => {
navigation.navigate('RequirePriceOrderDetail', {
quoteNoId: item?.quoteId,
askPurchaseId: item?.askPurchaseId,
// innerStatus: item?.innerStatus,
});
}}
>
<View style={myStyle['box-top']}>
<Text style={myStyle['box-top-text']}>
求购需求单号:
......@@ -123,7 +132,7 @@ const CheckOrderItem = props => {
{/* innerStatus 内部状态,1,"待提交审核",2,"待审核(一级)",3,"待审核(二级)",4,"待提交报价单)",5,"已提交",6,"审核不通过(一级)",7,"审核不通过(二级)" */}
{renderButton()}
</View>
</View>
</TouchableOpacity>
);
};
export default CheckOrderItem;
......@@ -40,19 +40,20 @@ const Home: React.FC<HomeNavigationProp> = ({ navigation, route }) => {
const { userStore } = useStores();
const [userInfo, setUerInfo] = useState({});
const [initColumn, setInitColumn] = useState([]);
useEffect(() => {
let _USER_INFO = null;
const getInfo = async () => {
try {
_USER_INFO = await getAsyncStorage(USER_INFO);
} catch {}
setUerInfo(_USER_INFO);
// const { data } = await getMemberMobileLoginReget({ shopType: '1' });
// _USER_INFO?.memberRoleId
// ? (data.memberRoleId = _USER_INFO.memberRoleId)
// : _roleType;
// setUerInfo(data);
// userStore.setUserInfo(data);
let _USER_INFO = userStore.userInfo;
if (!_USER_INFO) {
_USER_INFO = await getAsyncStorage(USER_INFO);
}
setUerInfo(_USER_INFO);
} catch {
navigation.replace('Login');
// const { data } = await getMemberMobileLoginReget({ shopType: '1' });
// setUerInfo(data);
}
};
getInfo();
}, []);
......@@ -88,7 +89,6 @@ const Home: React.FC<HomeNavigationProp> = ({ navigation, route }) => {
const styles = useAppStyle(themeStyles);
const { t } = useLocale('home');
console.log(userInfo, 'userInfouserInfouserInfo');
const jumpSetting = () => {
navigation.navigate('AccountInfo');
};
......@@ -110,7 +110,6 @@ const Home: React.FC<HomeNavigationProp> = ({ navigation, route }) => {
{/* 账号信息 */}
<View style={styles.Xcontainer}>
<View style={styles.Xwrapper}>
{/* ------------ */}
<View style={styles.XwrapperLeft}>
<View style={styles['XwrapperLeft-name']}>
<Text style={styles.Xtitle}>
......@@ -122,7 +121,6 @@ const Home: React.FC<HomeNavigationProp> = ({ navigation, route }) => {
<Text style={styles.Xtitle}>账号:{userInfo?.phone}</Text>
</View>
</View>
{/* ------------ */}
<TouchableOpacity
onPress={() => jumpSetting()}
......
......@@ -47,25 +47,7 @@ const RequireOrderDetail = ({ route, navigation }: IProp) => {
// const url =
// 'https://www.huf-haus.com/fileadmin/Bilder/Header/ART_3/Header_HUF_Haus_ART_3___1_.jpg';
const handlePress = () => {
// let PictureDir = fs.dirs.PictureDir; // this is the pictures directory. You can check the available directories in the wiki.
// let options = {
// fileCache: true,
// addAndroidDownloads: {
// useDownloadManager: true, // setting it to true will use the device's native download manager and will be shown in the notification bar.
// notification: false,
// path: PictureDir + '/me_', // this is the path where your downloaded file will live in
// description: 'Downloading image.',
// },
// };
// try {
// config(options)
// .fetch('GET', url)
// .then(res => {
// // do some magic here
// });
// } catch {}
};
const handlePress = () => {};
const Scroll = (evt: NativeSyntheticEvent<NativeScrollEvent>) => {
const { nativeEvent } = evt;
......@@ -209,7 +191,7 @@ const RequireOrderDetail = ({ route, navigation }: IProp) => {
return (
<View style={myStyle.container}>
<ScrollView onScroll={Scroll}>
<ScrollView>
{/* 头部 */}
<NavBar
title=""
......@@ -252,7 +234,6 @@ const RequireOrderDetail = ({ route, navigation }: IProp) => {
</View>
{/* 基本信息 */}
<View style={myStyle.cell}>
<View style={myStyle.HeadCell}>
<Text style={myStyle.HeadCellText}>{'基本信息'}</Text>
......@@ -328,12 +309,12 @@ const RequireOrderDetail = ({ route, navigation }: IProp) => {
})}
</View>
{/* 其他条件 */}
{/* 件 */}
<View style={myStyle.cell}>
<View style={myStyle.HeadCell}>
<Text style={myStyle.HeadCellText}>{'附件'}</Text>
</View>
{orderData?.enclosureUrls.map((item, index) => {
{orderData?.enclosureUrls?.map((item, index) => {
// console.log(item, 'itemitemitemitemitem');
return (
<>
......
......@@ -26,6 +26,7 @@ import Foot from '../../../Order/MycommodityDetails/components/Foot';
import Footer from '../../components/Footer';
import { useNavigation } from '@react-navigation/native';
import { Modal } from '@ui-kitten/components';
import Icons from 'react-native-vector-icons/AntDesign';
// id =2
type Params = {
......@@ -95,12 +96,34 @@ const RequirePriceOrderDetail: FcRoute<
{item.value}
</Text>
{item.hasCopy && (
<Text
<View
style={{
backgroundColor: '#F5F6F7',
justifyContent: 'center',
alignItems: 'center',
marginLeft: 10,
}}
>
<Text
style={[myStyle.addressName, { paddingHorizontal: 5 }]}
onPress={() => handleCopy(item.value)}
>
{t('order.btn.copy')}
</Text>
</View>
)}
{item.hasDetail && (
<TouchableOpacity
style={[myStyle.addressName, { marginLeft: 10 }]}
onPress={() => handleCopy(item.value)}
onPress={() => {
console.log(orderData, '--------');
navigation.navigate('RequireOrderDetail', {
id: orderData?.askPurchaseId,
});
}}
>
{t('order.btn.copy')}
</Text>
<Icons name={'right'} size={12} color={'#252D37'} />
</TouchableOpacity>
)}
</View>
</View>
......@@ -152,7 +175,11 @@ const RequirePriceOrderDetail: FcRoute<
const basicInfoList = [
{ title: '求购需求单号', value: orderData?.quoteNo, hasCopy: true },
{ title: '对应求购需求单', value: orderData?.askPurchaseNo },
{
title: '对应求购需求单',
value: orderData?.askPurchaseNo,
hasDetail: true,
},
{ title: '报价会员', value: orderData?.memberName },
{ title: '报价单摘要', value: orderData?.name },
{ title: '营业担当', value: orderData?.salesDirectorName },
......@@ -348,14 +375,23 @@ const RequirePriceOrderDetail: FcRoute<
{ fontSize: 12, marginRight: 10 },
]}
>
{orderData?.askPurchaseNo}
{orderData?.quoteNo}
</Text>
<Text
style={[myStyle.addressName]}
onPress={() => handleCopy(orderData?.askPurchaseNo)}
<View
style={{
backgroundColor: '#F5F6F7',
justifyContent: 'center',
alignItems: 'center',
marginLeft: 10,
}}
>
{t('order.btn.copy')}
</Text>
<Text
style={[myStyle.addressName]}
onPress={() => handleCopy(orderData?.quoteNo)}
>
{t('order.btn.copy')}
</Text>
</View>
</View>
</View>
</View>
......
......@@ -63,7 +63,8 @@ export default (theme: ThemeStyle) =>
},
addressName: {
fontSize: 12,
color: '#252D37',
alignItems: 'center',
justifyContent: 'center',
},
addressText: {
fontSize: 13,
......
import { useNavigation } from '@react-navigation/native';
import React, { useRef, useEffect, useState } from 'react';
import {
View,
TextInput,
StatusBar,
TouchableOpacity,
FlatList,
Text,
ScrollView,
} from 'react-native';
import NavBar from '../../components/NavBar';
import useAppStyle from '../../hooks/useAppStyle';
import styles from './styles';
type dataSource = {
/** 选中 */
isExecute?: number;
/** 状态 */
roleName?: string;
/** 备注 */
operationalProcess?: string;
};
interface StepProps {
/** 流转进度数据 */
dataSource?: dataSource[];
}
const ProcessLayout: React.FC<StepProps> = (props: StepProps) => {
const { dataSource } = props;
const myStyle = useAppStyle(styles);
return (
<View style={myStyle.Process}>
<View style={myStyle['Process-title']}>
<Text style={myStyle['Process-title-text']}>流转进度</Text>
</View>
<View style={myStyle['Process-line']}>
{/* <ScrollView horizontal> */}
<View
style={{
width: '100%',
flexDirection: 'row',
}}
>
{dataSource &&
// style={myStyle[]}
dataSource.map((item: any, index: number) => (
<View style={myStyle['statusLayout-cell']} key={`cell_${index}`}>
<View style={myStyle['statusLayout-dotLineBox']}></View>
<View
style={[
myStyle['statusLayout-dot'],
{
backgroundColor: item.isExecute ? '#00B37A' : '#EBEDF0',
},
]}
/>
{index !== dataSource.length - 1 && (
<View
style={[
myStyle['statusLayout-line'],
{
backgroundColor: item.isExecute ? '#00B37A' : '#EBEDF0',
},
]}
/>
)}
<View style={myStyle['statusLayout-cellTextBox']}>
{item.operationalProcess !== '' && (
<View>
<Text style={myStyle['statusLayout-cellText']}>
{item.operationalProcess}
</Text>
</View>
)}
{item && item.roleName !== '' && (
<View>
<Text style={myStyle['statusLayout-cellText']}>
{item.roleName}
</Text>
</View>
)}
</View>
</View>
))}
</View>
{/* </ScrollView> */}
</View>
</View>
);
};
export default ProcessLayout;
import { useNavigation } from '@react-navigation/native';
import React, { useRef, useEffect, useState } from 'react';
import {
View,
TextInput,
StatusBar,
TouchableOpacity,
FlatList,
Text,
ScrollView,
} from 'react-native';
import NavBar from '../../components/NavBar';
import useAppStyle from '../../hooks/useAppStyle';
import styles from './styles';
type dataSource = {
/** 状态 */
operation?: string;
/** 时间 */
operationTime?: number;
/** 操作人员 */
roleName?: string;
/** 备注 */
auditOpinion?: any;
};
interface TimeLineProps {
/** 流转进度数据 */
dataSource?: dataSource[];
}
const TimeLineLayout: React.FC<TimeLineProps> = (props: TimeLineProps) => {
const { dataSource } = props;
const myStyle = useAppStyle(styles);
return (
<View style={myStyle.Process}>
<View></View>
</View>
);
};
export default TimeLineLayout;
/* eslint-disable @typescript-eslint/no-use-before-define */
import { useNavigation } from '@react-navigation/native';
import React, { useRef, useEffect, useState } from 'react';
import {
View,
TextInput,
StatusBar,
TouchableOpacity,
FlatList,
Text,
} from 'react-native';
import NavBar from '../../components/NavBar';
import useAppStyle from '../../hooks/useAppStyle';
import ProcessLayout from './ProcessLayout';
import styles from './styles';
import TimeLineLayout from './timeLineLayout';
const TAB_LIST = ['外部状态', '内部状态'];
const StatusLayout = () => {
const myStyle = useAppStyle(styles);
const navigation = useNavigation();
const [tabIndex, setTabIndex] = useState<number>(0);
useEffect(() => {}, []);
const handlePress = index => {
setTabIndex(index);
};
return (
<View style={{ height: '100%' }}>
<NavBar
title={'审批状态'}
titleColor="#ffffff"
backIconColor="#ffffff"
customStyle={{ backgroundColor: '#00A98F' }}
/>
{/* style={myStyle.tab} */}
<View style={{ flex: 1 }}>
{/* Tab */}
<View style={myStyle.tab}>
{TAB_LIST.map((item, index) => {
return (
<TouchableOpacity
key={item}
style={[
myStyle['tab-container'],
index === tabIndex
? { borderBottomColor: '#00A98F', borderBottomWidth: 2 }
: null,
]}
onPress={() => {
handlePress(index);
}}
>
<Text style={myStyle['tab-text']}>{item}</Text>
</TouchableOpacity>
);
})}
</View>
{/* TabPlane */}
<View style={myStyle.TabPlane}>
<ProcessLayout dataSource={Data.externalQuotationStateResponses} />
<TimeLineLayout dataSource={Data.externalRequisitionFormResponses} />
</View>
</View>
<View></View>
</View>
);
};
const Data = {
id: 31,
quotationNo: 'BJIZ2XJTP',
inquiryListNo: 'XJXEBAJFT',
inquiryListId: 52,
deliveryInstructions: null,
details: '报价字母钢',
memberName: '倾城采购商',
deliveryTime: 1668427987669,
quotationAsTime: 1668341591234,
voucherTime: 1668255200173,
externalState: 4,
interiorState: 5,
contactId: null,
contactName: '微笑供应商',
phoneCode: '86',
contactPhone: '18800000288',
minimumOrder: 1,
paymentType: null,
taxes: null,
logistics: null,
packRequire: null,
fullAddress: '小李 北京北京市东城区东华门街道巴比伦 18800000388',
fullAddressId: 47,
supplyMembersName: '微笑供应商',
supplyMembersId: 156,
supplyMembersRoleId: 6,
offer: null,
shopId: 502,
otherRequire: null,
enclosureUrls: null,
externalRequisitionFormResponses: [
{
id: 84,
inquiryListId: 52,
roleName: 'B2B采购商',
state: 2,
operation: '提交询价单',
operationTime: 1668255307827,
auditOpinion: '',
stateName: '待提交报价单',
},
{
id: 87,
inquiryListId: 52,
roleName: 'B2B供应商',
state: 3,
operation: '提交报价单',
operationTime: 1668255839296,
auditOpinion: null,
stateName: '待确认报价单',
},
{
id: 88,
inquiryListId: 52,
roleName: 'B2B采购商',
state: 4,
operation: '确认报价单',
operationTime: 1668257065563,
auditOpinion: null,
stateName: '接受报价',
},
],
externalQuotationStateResponses: [
{
state: 1,
stateName: null,
roleName: '',
isExecute: 1,
operationalProcess: '提交询价单',
},
{
state: 2,
stateName: null,
roleName: '',
isExecute: 1,
operationalProcess: '提交报价单',
},
{
state: 3,
stateName: null,
roleName: '',
isExecute: 1,
operationalProcess: '确认报价单',
},
],
interiorQuotationLogResponses: [
{
id: 82,
productQuotationId: null,
roleName: '倾城采购商',
roleId: 8,
state: 2,
stateName: '待审核(一级)',
operation: '审批询价报价单',
operationTime: 1668255859353,
auditOpinion: '同意',
department: '',
position: '超级管理员',
},
{
id: 84,
productQuotationId: null,
roleName: '倾城采购商',
roleId: 8,
state: 3,
stateName: '待审核(二级)',
operation: '审核报价单(一级)',
operationTime: 1668257015904,
auditOpinion: '同意',
department: '',
position: '超级管理员',
},
{
id: 85,
productQuotationId: null,
roleName: '倾城采购商',
roleId: 8,
state: 4,
stateName: '待确认',
operation: '审核报价单(二级)',
operationTime: 1668257039678,
auditOpinion: '同意',
department: '',
position: '超级管理员',
},
{
id: 87,
productQuotationId: null,
roleName: '倾城采购商',
roleId: 8,
state: 5,
stateName: '已确认',
operation: '确认报价单',
operationTime: 1668257065288,
auditOpinion: '接受报价',
department: '',
position: '超级管理员',
},
],
interiorQuotationStateResponses: [
{
state: 1,
stateName: null,
roleName: '超级管理员',
isExecute: 1,
operationalProcess: '提交审核报价单',
},
{
state: 2,
stateName: null,
roleName: '超级管理员',
isExecute: 1,
operationalProcess: '审核报价单(一级)',
},
{
state: 3,
stateName: null,
roleName: '超级管理员',
isExecute: 1,
operationalProcess: '审核报价单(二级)',
},
{
state: 4,
stateName: null,
roleName: '超级管理员',
isExecute: 1,
operationalProcess: '确认报价单',
},
],
products: [
{
id: 53,
productId: 329,
productName: '询价商品-品类数字钢/',
category: '数字钢',
brand: null,
unit: '个',
purchaseCount: null,
inquiryListId: null,
productQuotationId: null,
money: null,
price: null,
memberId: 156,
memberRoleId: 6,
logistics: {
deliveryType: 1,
carriageType: 1,
weight: 1,
useTemplate: false,
templateId: null,
sendAddress: 37,
company: null,
render: null,
},
minOrder: null,
imgUrl:
'https://shushangyun01.oss-cn-shenzhen.aliyuncs.com/IMG_6752(20210810-205740)f54eab335c9e41048adaa4e63a762482.JPG',
taxRate: null,
},
],
externalStateName: '接受报价',
interiorStateName: '已确认',
currencyName: null,
};
export default StatusLayout;
import { AlignType } from './../../components/Space/index';
import { StyleSheet, Platform } from 'react-native';
import { ThemeStyle } from '../../constants/theme';
import themeLayout from '../../constants/theme/layout';
export default (theme: ThemeStyle) =>
StyleSheet.create({
tab: {
height: 40,
width: '100%',
backgroundColor: '#fff',
flexDirection: 'row',
// justifyContent: 'center',
// alignContent: 'center',
},
'tab-container': {
alignItems: 'center',
justifyContent: 'center',
flex: 1,
},
'tab-text': {
color: '#252D37',
fontSize: 14,
fontWeight: Platform.OS === 'ios' ? '500' : '600',
},
TabPlane: {
backgroundColor: '#F5F6F7',
width: '100%',
height: '100%',
paddingHorizontal: 8,
},
Process: {
width: '100%',
height: 120,
backgroundColor: '#fff',
marginVertical: 8,
borderRadius: 8,
paddingTop: 8,
paddingHorizontal: 12,
},
'Process-title': {
height: 40,
justifyContent: 'center',
},
'Process-title-text': {
color: '#303133',
fontSize: 14,
fontWeight: Platform.OS === 'ios' ? '500' : '600',
},
'Process-line': {
height: 80,
width: '100%',
justifyContent: 'center',
},
'statusLayout-cell': {
flex: 1,
width: '100%',
// backgroundColor: 'pink',
},
'statusLayout-dotLineBox': {
width: '100%',
justifyContent: 'center',
},
'statusLayout-dot': {
width: 8,
height: 8,
borderRadius: 4,
},
'statusLayout-line': {
height: 1,
marginHorizontal: 4,
width: '100%',
backgroundColor: 'pink',
position: 'relative',
top: -5,
},
'statusLayout-cellTextBox': {
paddingTop: 8,
width: '100%',
},
'statusLayout-cellText': {
fontSize: 12,
color: ' #606266',
},
});
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment