Commit 31e4c620 authored by shiyunjie's avatar shiyunjie

保险产品详情页

parent 33cc55e3
......@@ -17,19 +17,6 @@ const instructions = Platform.select({
'Shake or press menu button for dev menu',
});
type Props = {};
export default class App extends Component<Props> {
render() {
return (
<View style={styles.container}>
<Text style={styles.welcome}>Welcome to React Native!</Text>
<Text style={styles.instructions}>To get started, edit App.js</Text>
<Text style={styles.instructions}>{instructions}</Text>
</View>
);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
......@@ -48,3 +35,18 @@ const styles = StyleSheet.create({
marginBottom: 5,
},
});
type Props = {};
export default class App extends Component<Props> {
render() {
return (
<View style={styles.container}>
<Text style={styles.welcome}>Welcome to React Native!</Text>
<Text style={styles.instructions}>To get started, edit App.js</Text>
<Text style={styles.instructions}>{instructions}</Text>
</View>
);
}
}
......@@ -5,9 +5,7 @@
## 前言
前人栽树,后人乘凉。Agera的主要目的是
基于客户通项目封装,设计参考交银e保通,交银爱行销
Agera基于客户通项目封装,设计参考交银e保通,交银爱行销
Agera一期,要建立稳定的演示环境,演示在线投保(包括空中签名、保单签收),培训,绩效查询,行销工具
......@@ -59,6 +57,10 @@ trainPage
achievement
setting
login
原生webview
原生启动图
......
......@@ -14,7 +14,6 @@
00C302EA1ABCBA2D00DB3ED1 /* libRCTVibration.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 00C302E41ABCB9EE00DB3ED1 /* libRCTVibration.a */; };
00E356F31AD99517003FC87E /* BasicAppTests.m in Sources */ = {isa = PBXBuildFile; fileRef = 00E356F21AD99517003FC87E /* BasicAppTests.m */; };
0E3F3C3B82CD4C10948E6344 /* Entypo.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 99E1BFFB629F466DAB4074DD /* Entypo.ttf */; };
0F8BB7B3815B4E99BA722DA3 /* Lottie.framework in Frameworks */ = {isa = PBXBuildFile; fileRef = BDC32CC575074F1BB2B7F5EC /* Lottie.framework */; };
11D1A2F320CAFA9E000508D9 /* libRCTAnimation.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 5E9157331DD0AC6500FF2AA8 /* libRCTAnimation.a */; };
12A3942C23004AF49A81C49F /* libLottieReactNative.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 8152F9826A9C45E1985E1CB9 /* libLottieReactNative.a */; };
133E29F31AD74F7200F7D852 /* libRCTLinking.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 78C398B91ACF4ADC00677621 /* libRCTLinking.a */; };
......@@ -56,6 +55,8 @@
6068B983236A42738266D0CE /* libLottie.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 5CD923ED2B8C4C44B328B1B0 /* libLottie.a */; };
7D086754CFF647B296C82959 /* FontAwesome5_Brands.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 8BEF1FB779D54460BAA6C75D /* FontAwesome5_Brands.ttf */; };
832341BD1AAA6AB300B99B32 /* libRCTText.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 832341B51AAA6A8300B99B32 /* libRCTText.a */; };
83CA52CD22D8EFD0005440C0 /* Lottie.framework in Frameworks */ = {isa = PBXBuildFile; fileRef = 836D007C22C6345500DC9A54 /* Lottie.framework */; };
83CA52CE22D8EFD0005440C0 /* Lottie.framework in Embed Frameworks */ = {isa = PBXBuildFile; fileRef = 836D007C22C6345500DC9A54 /* Lottie.framework */; settings = {ATTRIBUTES = (CodeSignOnCopy, RemoveHeadersOnCopy, ); }; };
83FA0E6422CAE564000CDF1B /* libART.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 83FA0E2A22CAE546000CDF1B /* libART.a */; };
97D73CDBCBBF483C99E06DBA /* FontAwesome.ttf in Resources */ = {isa = PBXBuildFile; fileRef = A45B683174C84617B17BFEB8 /* FontAwesome.ttf */; };
9BD4B34961424375BF4F1F92 /* libRNGestureHandler.a in Frameworks */ = {isa = PBXBuildFile; fileRef = D2F86DBC4936427193CB045A /* libRNGestureHandler.a */; };
......@@ -454,6 +455,13 @@
remoteGlobalIDString = A287971D1DE0C0A60081BDFA;
remoteInfo = FastImage;
};
83CA52CF22D8EFD0005440C0 /* PBXContainerItemProxy */ = {
isa = PBXContainerItemProxy;
containerPortal = 9E9FB8BA5F684112B34F24E8 /* Lottie.xcodeproj */;
proxyType = 1;
remoteGlobalIDString = 62CA59B71E3C173B002D7188;
remoteInfo = Lottie_iOS;
};
83F2776D22B25E860066BA73 /* PBXContainerItemProxy */ = {
isa = PBXContainerItemProxy;
containerPortal = DC7A0D31E6A74DA6B87DABB7 /* RNDeviceInfo.xcodeproj */;
......@@ -512,6 +520,20 @@
};
/* End PBXContainerItemProxy section */
/* Begin PBXCopyFilesBuildPhase section */
83CA52D122D8EFD1005440C0 /* Embed Frameworks */ = {
isa = PBXCopyFilesBuildPhase;
buildActionMask = 2147483647;
dstPath = "";
dstSubfolderSpec = 10;
files = (
83CA52CE22D8EFD0005440C0 /* Lottie.framework in Embed Frameworks */,
);
name = "Embed Frameworks";
runOnlyForDeploymentPostprocessing = 0;
};
/* End PBXCopyFilesBuildPhase section */
/* Begin PBXFileReference section */
0089D8B24EC54781BF75BC39 /* libRNReanimated-tvOS.a */ = {isa = PBXFileReference; explicitFileType = undefined; fileEncoding = 9; includeInIndex = 0; lastKnownFileType = archive.ar; path = "libRNReanimated-tvOS.a"; sourceTree = "<group>"; };
00C302A71ABCB8CE00DB3ED1 /* RCTActionSheet.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTActionSheet.xcodeproj; path = "../node_modules/react-native/Libraries/ActionSheetIOS/RCTActionSheet.xcodeproj"; sourceTree = "<group>"; };
......@@ -604,6 +626,7 @@
11D1A2F320CAFA9E000508D9 /* libRCTAnimation.a in Frameworks */,
146834051AC3E58100842450 /* libReact.a in Frameworks */,
00C302E51ABCBA2D00DB3ED1 /* libRCTActionSheet.a in Frameworks */,
83CA52CD22D8EFD0005440C0 /* Lottie.framework in Frameworks */,
00C302E71ABCBA2D00DB3ED1 /* libRCTGeolocation.a in Frameworks */,
00C302E81ABCBA2D00DB3ED1 /* libRCTImage.a in Frameworks */,
133E29F31AD74F7200F7D852 /* libRCTLinking.a in Frameworks */,
......@@ -616,7 +639,6 @@
5049979F956343A58ED88DD1 /* libRNSpringScrollView.a in Frameworks */,
465A4413D3ED482699A0A651 /* libRNDeviceInfo.a in Frameworks */,
E7E9E85166CA4272AB0CF4FE /* libBVLinearGradient.a in Frameworks */,
0F8BB7B3815B4E99BA722DA3 /* Lottie.framework in Frameworks */,
6068B983236A42738266D0CE /* libLottie.a in Frameworks */,
12A3942C23004AF49A81C49F /* libLottieReactNative.a in Frameworks */,
9BD4B34961424375BF4F1F92 /* libRNGestureHandler.a in Frameworks */,
......@@ -1061,10 +1083,12 @@
13B07F8C1A680F5B00A75B9A /* Frameworks */,
13B07F8E1A680F5B00A75B9A /* Resources */,
00DD1BFF1BD5951E006B06BC /* Bundle React Native code and images */,
83CA52D122D8EFD1005440C0 /* Embed Frameworks */,
);
buildRules = (
);
dependencies = (
83CA52D022D8EFD0005440C0 /* PBXTargetDependency */,
);
name = BasicApp;
productName = "Hello World";
......@@ -1739,7 +1763,7 @@
);
runOnlyForDeploymentPostprocessing = 0;
shellPath = /bin/sh;
shellScript = "export NODE_BINARY=node\n../node_modules/react-native/scripts/react-native-xcode.sh";
shellScript = "export NODE_BINARY=node\n../node_modules/react-native/scripts/react-native-xcode.sh\n";
};
2D02E4CB1E0B4B27006451C7 /* Bundle React Native Code And Images */ = {
isa = PBXShellScriptBuildPhase;
......@@ -1805,6 +1829,11 @@
target = 2D02E47A1E0B4A5D006451C7 /* BasicApp-tvOS */;
targetProxy = 2D02E4911E0B4A5D006451C7 /* PBXContainerItemProxy */;
};
83CA52D022D8EFD0005440C0 /* PBXTargetDependency */ = {
isa = PBXTargetDependency;
name = Lottie_iOS;
targetProxy = 83CA52CF22D8EFD0005440C0 /* PBXContainerItemProxy */;
};
/* End PBXTargetDependency section */
/* Begin PBXVariantGroup section */
......@@ -1955,6 +1984,7 @@
CODE_SIGN_STYLE = Manual;
CURRENT_PROJECT_VERSION = 1;
DEVELOPMENT_TEAM = K3P7TW9FM8;
GCC_OPTIMIZATION_LEVEL = s;
HEADER_SEARCH_PATHS = (
"$(inherited)",
"$(SRCROOT)/../node_modules/react-native-vector-icons/RNVectorIconsManager",
......
......@@ -80,9 +80,9 @@
</AdditionalOptions>
</TestAction>
<LaunchAction
buildConfiguration = "Release"
selectedDebuggerIdentifier = ""
selectedLauncherIdentifier = "Xcode.IDEFoundation.Launcher.PosixSpawn"
buildConfiguration = "Debug"
selectedDebuggerIdentifier = "Xcode.DebuggerFoundation.Debugger.LLDB"
selectedLauncherIdentifier = "Xcode.DebuggerFoundation.Launcher.LLDB"
launchStyle = "0"
useCustomWorkingDirectory = "NO"
ignoresPersistentStateOnLaunch = "NO"
......
......@@ -60,7 +60,8 @@ const TabPage = createBottomTabNavigator(
height: 49,
},
safeAreaInset: {
bottom: 'always',
//bottom: 'always',
bottom: 'never',
top: 'never',
},
showLabel: false,
......
......@@ -30,7 +30,7 @@ class TabButton extends Component<Props> {
color={color}
/>
<Text
style={{ color }}
style={{ color, fontSize: 14 }}
textAlign="center"
>
{tabBarTitle}
......
......@@ -10,6 +10,8 @@ export const BANNER = 'banner';
export const TITLE = 'title';
export const LIST_ITEM = 'listItem';
export const CHOOSE = 'choose';
export const PRODUCT = 'product';
export const SERVICE = 'service';
const initConfig = {
insuranceProcess: [
......@@ -43,7 +45,8 @@ const initConfig = {
h1: '', //主标题
rightIcon: '', //右侧icon
rightText: '', //右侧文字
onPress: () => {}, //点击事件
onPress: () => {
}, //点击事件
},
data: [{ key: '', value: '' }],
},
......@@ -55,14 +58,22 @@ const initConfig = {
h1: '', //主标题
rightIcon: '', //右侧icon
rightText: '', //右侧文字
onPress: () => {}, //点击事件
onPress: () => {
}, //点击事件
},
text: '', // 选择框显示标题
values: [], // 选择框数据集合
source: {}, //修改源对象
setKey: '', //修改源对象内的属性名称
onChange: () => {}, //选中事件
onWillChange: () => {}, // 选中前执行事件
onChange: () => {
}, //选中事件
onWillChange: () => {
}, // 选中前执行事件
},
{
type: PRODUCT,
key: PRODUCT,
uri: '',
},
],
rules: [
......
......@@ -4,12 +4,12 @@ import {
View,
} from 'react-native';
import FastImage from 'react-native-fast-image';
import { ListItem } from 'react-native-elements';
import Text from '../../components/Text';
import {
BANNER, TITLE, LIST_ITEM, CHOOSE,
BANNER, TITLE, LIST_ITEM, CHOOSE, PRODUCT, SERVICE,
} from './config';
import BasicIcon from "../../components/BasicIcon";
import { ListItem } from "react-native-elements";
import BasicIcon from '../../components/BasicIcon';
function renderBanner(props) {
console.log('renderBanner:', props);
......@@ -37,13 +37,13 @@ function renderTitle(props) {
<Text style={{
color: '#333',
fontSize: 18,
marginTop:15,
marginTop: 15,
}}
>
{props.h1}
</Text>
<Text style={{
marginTop:10,
marginTop: 10,
color: '#999',
fontSize: 13,
}}
......@@ -78,39 +78,61 @@ function renderTitle(props) {
</View>
);
}
function renderListItem(props) {
return(
function f() {
}
function renderItemText(props) {
console.log('props:', props);
return (
<View>
{
<ListItem
key={`renderListItem${index}`}
containerStyle={{
borderBottomWidth: index < props.data.length - 1 ? 0.3 : 0,
borderBottomColor: '#ccc',
}}
title={item.title}
titleStyle={{ color: '#666', fontSize: 14 }}
leftElement={(
<FastImage
style={{ width: 24, height: 24 }}
source={{
uri: item.imgUrl,
priority: FastImage.priority.normal,
{props.text.map((text, index) => (
<ListItem
key={`ListItem${index}`}
containerStyle={{
borderBottomWidth: index < props.text.length - 1 ? 0.3 : 0,
borderBottomColor: '#ccc',
}}
resizeMode={FastImage.resizeMode.stretch}
title={text.name}
titleStyle={{ color: '#666', fontSize: 14 }}
leftElement={(
<View />
)}
rightElement={(
<Text>{text.value}</Text>
)}
/>
)}
rightElement={(
<BasicIcon
suite="Ionicons"
name="ios-arrow-forward"
size={24}
color="#666"
/>
)}
/>}
))
}
</View>
);
}
function renderListItem(props) {
const array = props.data;
console.log('array:', array);
return (
<View>
{array.map((item, index) => (
renderItemText(item)
))
}
</View>
);
}
function renderImage(props) {
console.log('props:',props)
return(
<FastImage
style={{ width: props.width, height: props.width * 1200 / 375 }}
source={{
uri: props.uri,
priority: FastImage.priority.normal,
}}
resizeMode={FastImage.resizeMode.contain}
/>
)
}
......@@ -121,9 +143,16 @@ export function renderPageByConfig(config, renderCustomView?) {
return renderBanner;
case TITLE:
return renderTitle;
case LIST_ITEM:
case LIST_ITEM:
return renderListItem;
case CHOOSE:
return ()=>{
}
case PRODUCT:
return renderImage;
case SERVICE:
return renderImage;
default:
return () => {
// 有自定义方法执行传入的渲染方法
......
......@@ -45,6 +45,15 @@ class HomePage extends Component<Props> {
this.scrollView = null;
}
componentDidMount() : void {
this.listener =NativeAppEventEmitter.addListener('react_navigation_onTransitionEnd_call',() => console.log('onTransitionEnd_call'))
}
componentWillUnmount() : void {
if(this.listener){
this.listener.remove();
}
}
_onRefresh = () => {
setTimeout(() => {
......@@ -63,17 +72,6 @@ class HomePage extends Component<Props> {
}, 3000);
};
componentDidMount() : void {
this.listener =NativeAppEventEmitter.addListener('react_navigation_onTransitionEnd_call',() => console.log('onTransitionEnd_call'))
}
componentWillUnmount() : void {
if(this.listener){
this.listener.remove();
}
}
render() {
const { pushTo } = this.props
return (
......
......@@ -15,14 +15,16 @@ import { connect } from 'react-redux';
import { SpringScrollView } from 'react-native-spring-scrollview';
import { CommonLottieHeader } from 'react-native-spring-scrollview/Customize/CommonLottieHeader';
import { pop } from '../../BasicNavigator/actions';
import NavigationBar from '../../components/NavigationBar';
import NavigationBar, { NavHeight } from '../../components/NavigationBar';
import BackButton from '../../components/BackButton';
import Styles from '../../theme/Styles';
import decorator from '../../utils/decorator';
import Text from '../../components/Text'
import {
BANNER, CHOOSE, BaseConfig, LIST_ITEM, TITLE,
BANNER, CHOOSE, BaseConfig, LIST_ITEM, TITLE, PRODUCT, SERVICE,
} from '../Agera-App-Insure/config';
import { renderPageByConfig } from '../Agera-App-Insure';
import Button from '../../components/ThemeButton';
type Props = {
routes: Array,
......@@ -69,7 +71,10 @@ class ProductDetailPage extends Component {
}
translateDataToConfig = (lay, params) => {
const { name, description, tagNameList,bannerIconUrl } = params.detail
const {
name, description, tagNameList, bannerIconUrl, guaranteeContent,
productIntroductionUrl, serviceProcessUrl } = params.detail;
console.log('guaranteeContent',guaranteeContent)
switch (lay.type) {
case BANNER:
return {
......@@ -85,9 +90,28 @@ class ProductDetailPage extends Component {
labelColor: '#cf4100', //颜色
};
case LIST_ITEM:
return {};
return {
title: {
icon: '', //左侧icon
h1: '', //主标题
rightIcon: '', //右侧icon
rightText: '', //右侧文字
onPress: () => {}, //点击事件
},
data: JSON.parse(guaranteeContent),
};
case CHOOSE:
return {};
case PRODUCT:
return {
uri: productIntroductionUrl,
width: global.SCREEN_WIDTH,
};
case SERVICE:
return {
uri: serviceProcessUrl,
width: global.SCREEN_WIDTH,
};
default:
return {};
}
......@@ -95,21 +119,21 @@ class ProductDetailPage extends Component {
translateDataToRules = (lay, rul, params) => {
switch (lay.type) {
case BANNER:
return {};
case TITLE:
return {};
case LIST_ITEM:
return {};
case CHOOSE:
return {};
default:
return {};
case BANNER:
return {};
case TITLE:
return {};
case LIST_ITEM:
return {};
case CHOOSE:
return {};
default:
return {};
}
}
render() {
const { config } = this.state
const { config } = this.state;
return (
<View style={Styles.container}>
<NavigationBar
......@@ -117,7 +141,7 @@ class ProductDetailPage extends Component {
title="太平保险"
/>
<SpringScrollView
ref={(com) => (this.scrollView = com)}
ref={com => (this.scrollView = com)}
styles={Styles.container}
inverted={false}
//onRefresh={this._onRefresh}
......@@ -129,6 +153,18 @@ class ProductDetailPage extends Component {
{config.layout.map((lay, index) => (
renderPageByConfig(lay)(lay)
))}
<View style={{flexDirection:'row',height:44,alignItems: 'stretch'}}>
<View style={{width:global.SCREEN_WIDTH * 150 / 375,justifyContent:'center',alignItems:'center',}}>
<Text style={{color:'#666', fontSize: 16}}>
金额
<Text style={{color:'#FF4656'}}> 125</Text>
</Text>
</View>
<Button
title="立即投保"
containerStyle={{ width:global.SCREEN_WIDTH * 225 /375 }}
/>
</View>
</SpringScrollView>
</View>
......
......@@ -83,7 +83,7 @@ export default {
detailsPageWxshareUrl: '',
guaranteeContent: '[{"text":[{"name":"航空意外身故、伤残","value":"100万元/份"}]}]',
bannerIconUrl: 'https://ecustomer.tp95589.com/static/insurance_img/201901/01/340dc870750b41e492ac9ee88b5aae2a.png',
productIntroductionUrl: 'https://ecustomer.tp95589.com/static/insurance_img/201906/12/be5dfbf9afc74ef99fdc39bef66ef292.png',
productIntroductionUrl: 'https://ecustomer.tp95589.com/static/insurance_img/201906/12/3d96dd2f2a6d4e579a53d4ee4bdd73cb.png',
serviceProcessUrl: 'https://ecustomer.tp95589.com/static/insurance_img/201906/12/be5dfbf9afc74ef99fdc39bef66ef292.png',
importantNotificationUrl: 'https://ecustomer.tp95589.com/static/insurance_img/201906/12/438000682508403caf62a15878c9416d.png',
tagNameList: [
......
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