cd新的排版

jscore/pages/Desktop/Home.js

@@ -23,7 +23,7 @@ class DesktopHome extends Component {
                     transformer: "线性反应原理",
                     insulation: "油浸式",
                     ratedVoltage: "1000kV/√3",
-                    ratedFrequencyAndPlace: "100Hz,户外",
+                    ratedFrequencyAndPlace: "100,户外",
                     powerFactor: "0.8",
                     ratedCurrent1: "1000000/5",
                     ratedCurrent2: "1000000/5",
@@ -34,7 +34,7 @@ class DesktopHome extends Component {
                     voltageChangeRate: "10000/√3/100/√3",
                     ratedSecondLoadTV: "17.5",
                     overlightLoadTV: "18.5",
-                    precisionTVoverlightLoadTV: "0.5SS",
+                    precisionTV: "0.5SS",
                     flagAndRight: "新，局属",
                     encodeType: "国标",
                     securityAndExpansionFactor: "10,1.2",
@@ -152,73 +152,66 @@ class DesktopHome extends Component {
                 <View style={styles.betweenView}>
                     <Text style={[styles.textColor, {borderRightWidth: 0.5,textAlign: 'left',  width: '30%'}]}>绕组配置 <Text
                         style={styles.textRed}>{item.windingCount}</Text></Text>
-                    <Text style={[styles.textColor, {borderRightWidth: 0.5,textAlign: 'left',  width: '40%'}]}>互感器原理 <Text
+                    <Text style={[styles.textColor, {borderRightWidth: 0.5,textAlign: 'left',  width: '45%'}]}>互感器原理 <Text
                         style={styles.textRed}>{item.transformer}</Text></Text>
-                    <Text style={[styles.textColor, {textAlign: 'left', width: '30%'}]}>绝缘方式 <Text
+                    <Text style={[styles.textColor, {textAlign: 'left', width: '25%'}]}>绝缘方式 <Text
                         style={styles.textRed}>{item.insulation}</Text></Text>
                     {/*<Text style={{borderRightColor}}>绝缘方式 <Text style={styles.textRed}>{item.insulation}</Text></Text>*/}
                 </View>
                 <View style={styles.betweenView}>
                     <Text style={[styles.textColor, {borderRightWidth: 0.5,textAlign: 'left',  width: '30%'}]}>额定电压 <Text
                         style={styles.textRed}>{item.ratedVoltage}</Text></Text>
-                    <Text style={[styles.textColor, {borderRightWidth: 0.5,  width: '40%'}]}>额定频率,安装场所 <Text
+                    <Text style={[styles.textColor, {borderRightWidth: 0.5,  width: '45%'}]}>额定频率(Hz),安装场所 <Text
                         style={styles.textRed}>{item.ratedFrequencyAndPlace}</Text></Text>
-                    <Text style={[styles.textColor, {textAlign: 'left', width: '30%'}]}>功率因数 <Text
+                    <Text style={[styles.textColor, {textAlign: 'left', width: '25%'}]}>功率因数 <Text
                         style={styles.textRed}>{item.powerFactor}</Text></Text>
                 </View>
                 <View style={styles.betweenView}>
-                    <Text style={[styles.textColor, {borderRightWidth: 0.5, width: '25%'}]}>额定电流变化比(A)</Text>
-                    <Text style={[styles.textColor, {borderRightWidth: 0.5, width: '25%'}]}>TA额定二次负荷(VA)</Text>
-                    <Text style={[styles.textColor, {borderRightWidth: 0.5, width: '25%'}]}>TA轻载负荷(VA)</Text>
-                    <Text style={[styles.textColor, {width: '25%'}]}>TA精度</Text>
+                    <Text style={styles.textColor1}>额定电流变比(A)</Text>
+                    <Text style={styles.textColor2}>TA额定二次负荷(VA)</Text>
+                    <Text style={styles.textColor3}>TA轻载负荷(VA)</Text>
+                    <Text style={styles.textColor4}>TA精度</Text>
                 </View>
                 <View style={styles.betweenView}>
-                    <Text style={[styles.textColor, {borderRightWidth: 0.5, width: '25%'}]}>电流变比1 <Text
+                    <Text style={styles.textColor1}>电流变比1 <Text
                         style={styles.textRed}>{item.ratedCurrent1}</Text></Text>
-                    <Text style={{borderRightWidth: 0.5, width: '25%'}}/>
-                    <Text style={{borderRightWidth: 0.5, width: '25%'}}/>
-                    <Text style={{width: '25%'}}/>
+                    <Text style={{borderRightWidth: 0.5, width: '31%'}}/>
+                    <Text style={{borderRightWidth: 0.5, width: '26%'}}/>
+                    <Text style={{width: '16%'}}/>
                 </View>
                 <View style={[styles.betweenView, {borderTopWidth: 0,}]}>
-                    <Text style={[styles.textColor, {
-                        borderRightWidth: 0.5,
+                    <Text style={[styles.textColor1, {
                         borderTopWidth: 0.5,
-                        width: '25%'
                     }]}>电流变比2 <Text style={styles.textRed}>{item.ratedCurrent2}</Text></Text>
-                    <Text style={[styles.textColor, {borderRightWidth: 0.5, width: '25%'}]}><Text
+                    <Text style={styles.textColor2}><Text
                         style={styles.textRed}>{item.ratedSecondLoadTA}</Text></Text>
-                    <Text style={[styles.textColor, {borderRightWidth: 0.5, width: '25%'}]}><Text
+                    <Text style={styles.textColor3}><Text
                         style={styles.textRed}>{item.overlightLoadTA}</Text></Text>
-                    <Text style={[styles.textColor, {width: '25%'}]}><Text
+                    <Text style={styles.textColor4}><Text
                         style={styles.textRed}>{item.precisionTA}</Text></Text>
                 </View>
                 <View style={[styles.betweenView, {borderTopWidth: 0,}]}>
-                    <Text style={[styles.textColor, {
-                        borderRightWidth: 0.5,
+                    <Text style={[styles.textColor1, {
                         borderTopWidth: 0.5,
-                        width: '25%'
                     }]}>电流变比3 <Text style={styles.textRed}>{item.ratedCurrent3}</Text></Text>
-                    <Text style={{borderRightWidth: 0.5, width: '25%'}}/>
-                    <Text style={{borderRightWidth: 0.5, width: '25%'}}/>
-                    <Text style={{width: '25%'}}/>
+                    <Text style={{borderRightWidth: 0.5, width: '31%'}}/>
+                    <Text style={{borderRightWidth: 0.5, width: '26%'}}/>
+                    <Text style={{width: '16%'}}/>
                 </View>
                 <View style={styles.betweenView}>
-                    <Text style={[styles.textColor, {borderRightWidth: 0.5, width: '25%'}]}>电压比</Text>
-                    <Text style={[styles.textColor, {borderRightWidth: 0.5, width: '25%'}]}>TV额定二次负荷(VA)</Text>
-                    <Text style={[styles.textColor, {borderRightWidth: 0.5, width: '25%'}]}>TV轻载负荷(VA)</Text>
-                    <Text style={[styles.textColor, {width: '25%'}]}>TV精度</Text>
+                    <Text style={styles.textColor1}>电压比</Text>
+                    <Text style={styles.textColor2}>TV额定二次负荷(VA)</Text>
+                    <Text style={styles.textColor3}>TV轻载负荷(VA)</Text>
+                    <Text style={styles.textColor4}>TV精度</Text>
                 </View>
                 <View style={styles.betweenView}>
-                    <Text style={[styles.textColor, {
-                        borderRightWidth: 0.5,
-                        width: '25%'
-                    }]}><Text style={styles.textRed}>{item.voltageChangeRate}</Text></Text>
-                    <Text style={[styles.textColor, {borderRightWidth: 0.5, width: '25%'}]}><Text
+                    <Text style={styles.textColor1}><Text style={styles.textRed}>{item.voltageChangeRate}</Text></Text>
+                    <Text style={styles.textColor2}><Text
                         style={styles.textRed}>{item.ratedSecondLoadTV}</Text></Text>
-                    <Text style={[styles.textColor, {borderRightWidth: 0.5, width: '25%'}]}><Text
+                    <Text style={styles.textColor3}><Text
                         style={styles.textRed}>{item.overlightLoadTV}</Text></Text>
-                    <Text style={[styles.textColor, {width: '25%'}]}><Text
-                        style={styles.textRed}>{item.precisionTVoverlightLoadTV}</Text></Text>
+                    <Text style={styles.textColor4}><Text
+                        style={styles.textRed}>{item.precisionTV}</Text></Text>
                 </View>
                 <View style={styles.betweenView}>
                     <Text style={[styles.textColor, {
@@ -342,6 +335,33 @@ const styles = StyleSheet.create({
         fontSize: 11,
         textAlign: 'center',
     },
+    textColor1: {
+        color: '#333',
+        fontSize: 11,
+        textAlign: 'center',
+        borderRightWidth: 0.5,
+        width: '27%'
+    },
+    textColor2: {
+        color: '#333',
+        fontSize: 11,
+        textAlign: 'center',
+        borderRightWidth: 0.5,
+        width: '31%'
+    },
+    textColor3: {
+        color: '#333',
+        fontSize: 11,
+        textAlign: 'center',
+        borderRightWidth: 0.5,
+        width: '26%'
+    },
+    textColor4: {
+        color: '#333',
+        fontSize: 11,
+        textAlign: 'center',
+        width: '16%'
+    },
     textRed: {
         color: 'red',
     },