occ-mobile/app/containers/order/OrderDetail.js

import React, { Component } from 'react'
import {
  StyleSheet,
  View,
  Image,
  ImageBackground,
  StatusBar,
  Text,
  TouchableOpacity,
  Dimensions,
  PixelRatio,
  ScrollView,
  FlatList,
} from 'react-native'
import { connect } from 'react-redux'
import StatusBacg from '../../static/images/Order-status.png'
import png from '../../static/images/defaultimg.jpg'
import Icon from '../../components/Iconfont/Iconfont'
import { NavigationActions, createAction } from '../../utils'
import { ScaleUtil, ReturnDate, accSub } from '../../utils/utils'
import redblue from '../../static/images/ic-redblue.png'
import { ImageBaseUrl } from '../../utils/fetch/Fetchx'
import { transrefFn } from '../common/datamodel/dataModel'
const { width, height } = Dimensions.get('window')
/**
 * TEMPORY_STORAGE("01","暂存","暂存"),
 * 	AUDIT_PENDING("02","待审核","待审核"),
 * 	DELIVERY_PENDING("03","待发货","待发货"),
 * 	SIGN_IN_PENDING("04","待签收","待签收"),
 * TRANS_COMPLETE("05","交易完成","交易完成"),
 * REJECT("06","驳回","驳回"),
 * 	CANCEL("07","取消","取消");
 */

// [0]:暂存;  [1]:待审核;  [2]:待发货;  [3]:待签收;  [4]:交易完成;  [5]:驳回;  [6]:取消
const iconArr = [
  'icon-icon-zancun',
  'icon-icon-dingdandaishenhe',
  'icon-icon-dingdandaifahuo',
  'icon-icon-dingdandaiqianshou',
  'icon-icon-jiaoyiwancheng',
  'icon-icon-dingdanbohui',
  'icon-icon-dingdanquxiao',
]

@connect(({ theme, orderdetail, orderlist }) => ({
  ...theme,
  ...orderdetail,
  ...orderlist,
}))
class OrderDetail extends Component {
  constructor() {
    super()
    this.state = {
      trackIndex: 0,
      trackName: '待发货',
      iconName: 'icon-icon-dingdan',
    }
  }

  componentDidMount = () => {
    // 订单跟踪开始偏移量
    trackOffset = 0
    if (this.state.trackIndex <= 2) {
      trackOffset = 0
    } else if (this.state.trackIndex == 3) {
      trackOffset = 120
    } else {
      trackOffset = 240
    }
    this._scrollView.scrollTo({
      x: trackOffset,
      y: 0,
      animated: true,
    })
    if (
      this.props.navigation.state.params &&
      Object.keys(this.props.navigation.state.params).indexOf('comeFrom') == -1
    ) {
      const {
        reqOrderItems,
        orderStatusCode,
      } = this.props.navigation.state.params.orderData
      // 每个商品行的 累计签收数量 - 累计退货数量 > 0 则可以进行整单退货 ---- signNum - returnNum >0
      if (
        orderStatusCode == '03' ||
        orderStatusCode == '04' ||
        (orderStatusCode == '05' &&
          reqOrderItems.some(
            item => accSub(item.signNum || 0, item.refundNum || 0) > 0
          ))
      ) {
        this.setState({ isReturn: true })
      }
    }
  }

  // 头部
  header(orderData) {
    console.log(orderData);
    return (
      <View
        style={{
          height: HEADERSTYLE.height,
          paddingTop: HEADERSTYLE.paddingTop + 5,
          backgroundColor: '#fff',
          borderBottomColor: '#eee',
          borderBottomWidth: 1 / PixelRatio.get(),
        }}
      >
        <View
          style={{
            flex: 1,
            justifyContent: 'center',
          }}
        >
          <TouchableOpacity
            style={{ position: 'absolute', left: 10, flexDirection: 'row' }}
            onPress={() => this.props.dispatch(NavigationActions.back())}
          >
            <Icon
              name="icon-icon-fanhui"
              size={20}
              color={'#666'}
              style={{ marginTop: 4 }}
            />
            <Text
              style={{
                fontSize: 14,
                lineHeight: 20,
                color: '#666',
                alignSelf: 'center',
              }}
            >
              返回
            </Text>
          </TouchableOpacity>
          <Text
            style={{
              alignSelf: 'center',
              fontSize: 18,
              lineHeight: 25,
              letterSpacing: 0.19,
              color: '#333',
            }}
          >
            {this.props.navigation.state.params &&
            this.props.navigation.state.params.comeFrom &&
            this.props.navigation.state.params.comeFrom == 'Refund'
              ? '退货单详情'
              : '订单详情'}
          </Text>
          <TouchableOpacity
            style={{ position: 'absolute', right: 10 }}
            onPress={() => {
              this.setState({
                activeAllCollaps: !this.state.activeAllCollaps,
              })
              // this._info.setActive()
              this.copyToEdit(orderData)
            }}
          >
            <Text
              style={{
                fontSize: 14,
                lineHeight: 20,
                letterSpacing: 0.17,
                color: '#666',
              }}
            >
              复制
            </Text>
          </TouchableOpacity>
        </View>
      </View>
    )
  }

  // 复制订单并跳转到编辑页
  async copyToEdit(item) {
    this.setState({ Loading: true })
    await this.props.dispatch(
      createAction('orderlist/copyFromReq')({
        id: item.id,
      })
    )
    this.setState({ Loading: false })
    const { copyData } = this.props

    let SaleOrSupplier = transrefFn(copyData, 'saleOrg'),
      billwayDefault = transrefFn(copyData, 'billWay'),
      transportDefault = transrefFn(copyData, 'transport')

    this.props.dispatch(
      NavigationActions.navigate({
        routeName: 'OrderEdit',
        params: {
          ShopData: copyData.reqOrderItems,
          data: copyData,
          SaleOrSupplier: SaleOrSupplier,
          reqOrderInvoice: copyData.reqOrderInvoice,
          reqOrderReceiveAddress: copyData.reqOrderReceiveAddress,
          transportDefault: transportDefault,
          billwayDefault: billwayDefault,
          comefrom: 'temporarily',
        },
      })
    )
  }

  //   流程跟踪
  processTrack(orderData) {
    let track = [],
      trackVal = orderData.reqOrderTracks.sort((a, b) => a.sort - b.sort)
    for (let i = 0; i < trackVal.length; i++) {
      if (trackVal[i].finish && trackVal[i + 1] && !trackVal[i + 1].finish) {
        this.state.trackIndex = i
      }
      if (i == trackVal.length - 1 && trackVal[i].finish) {
        this.state.trackIndex = i
      }
      track.push(
        <View key={i}>
          <View style={{ paddingBottom: 10 }}>
            <View
              style={{
                width: 120,
                height: 2,
                backgroundColor: trackVal[i].finish ? '#59C152' : '#EEE',
                marginTop: 8,
              }}
            />
            {this.state.trackIndex == i ? (
              <View
                style={{
                  left: '45%',
                  position: 'absolute',
                  width: 20,
                  height: 20,
                  borderRadius: 10,
                  backgroundColor: '#59C152',
                  overflow: 'hidden',
                  justifyContent: 'center',
                }}
              >
                <Text
                  style={{ fontSize: 10, color: '#FFF', alignSelf: 'center' }}
                >
                  √
                </Text>
              </View>
            ) : (
              <View
                style={{
                  left: '45%',
                  position: 'absolute',
                  width: 10,
                  height: 10,
                  backgroundColor: trackVal[i].finish ? '#59C152' : '#CCC',
                  borderRadius: 7,
                  marginTop: 4,
                }}
              />
            )}
          </View>
          <View style={{ paddingHorizontal: 5 }}>
            <Text
              style={{
                alignSelf: 'center',
                fontSize: 12,
                lineHeight: 17,
                color: '#333',
              }}
            >
              {trackVal[i].content}
            </Text>
            <Text
              style={{
                alignSelf: 'center',
                fontSize: 10,
                lineHeight: 14,
                letterSpacing: 0,
                color: '#666',
                letterSpacing: 0,
              }}
            >
              {/* {ReturnDate(trackVal[i].date)} */}
              {trackVal[i].finish ? ReturnDate(trackVal[i].operateTime) : ''}
            </Text>
          </View>
        </View>
      )
    }
    return track
  }

  // 底部按钮
  bottomTouch(orderData) {
    let ParamsOrder = orderData
    ParamsOrder.reqOrderItems.map(data => {
      if (data.signNum <= data.orderNum) {
        data.orderNum = data.signNum
      }
    })
    let touchArr = [],
      touchAtt = [
        {
          touchName: '退货',
          background: this.state.isReturn ? '#E70013' : '#969696',
          textColor: '#FFF',
          disabled: this.state.isReturn ? false : true,
          touchonpress: () => {
            // this.props.dispatch(
            //   NavigationActions.navigate({
            //     routeName: "ReturnApplication",
            //     params: { orderData: JSON.parse(JSON.stringify(ParamsOrder)) }
            //   })
            // );
            this.props.dispatch(
              createAction('orderlist/returnFromReq')({
                id: orderData.id,
                orderData: JSON.parse(JSON.stringify(ParamsOrder)),
              })
            )
          },
        },
      ]

    for (let i = 0; i < touchAtt.length; i++) {
      touchArr.push(
        <TouchableOpacity
          disabled={touchAtt[i].disabled}
          onPress={() =>
            touchAtt[i].touchonpress ? touchAtt[i].touchonpress() : {}
          }
          key={i}
          style={{
            flex: 1,
            borderTopColor: '#eee',
            borderTopWidth: 1 / PixelRatio.get(),
            backgroundColor: touchAtt[i].background,
            justifyContent: 'center',
            borderRightColor: '#eee',
            borderRightWidth: 1 / PixelRatio.get(),
          }}
        >
          <Text
            style={{
              fontSize: 14,
              lineHeight: 20,
              color: touchAtt[i].textColor,
              alignSelf: 'center',
            }}
          >
            {touchAtt[i].touchName}
          </Text>
        </TouchableOpacity>
      )
    }
    return touchArr
  }

  goodsInfo(item, index, comeFrom) {
    console.log(item);
    return (
      <View key={index}>
        <View
          style={{
            paddingHorizontal: 10,
            paddingVertical: 7,
            marginTop: 10,
            backgroundColor: '#FFF',
          }}
        >
          <View
            style={{
              paddingBottom: 10,
              flexDirection: 'row',
              borderBottomColor: '#DDD',
              borderBottomWidth: 1 / PixelRatio.get(),
            }}
          >
            <Image
              source={
                item.goodsImg ? { uri: ImageBaseUrl + item.goodsImg } : png
              }
              style={{ width: 60, height: 60 }}
            />
            <View style={{ marginLeft: 10, flex: 1 }}>
              <Text style={{ fontSize: 13, lineHeight: 18, color: '#333' }}>
                {item.goodsDisplayName || item.goodsName}
              </Text>
              <View
                style={{
                  flexDirection: 'row',
                  justifyContent: 'space-between',
                  marginTop: 5,
                }}
              >
                {comeFrom && comeFrom == 'Refund' ? null : (
                  <View>
                    <Text style={{ fontSize: 12, lineHeight: 17, color: '#666' }}>
                      编码：{item.goodsCode}
                    </Text>
                    <Text style={{ fontSize: 12, lineHeight: 17, color: '#666' }}>
                      型号：{item.model?item.model:""}
                    </Text>
                    <Text style={{ fontSize: 12, lineHeight: 17, color: '#666' }}>
                      规格：{item.specification?(item.specification.split("/")[0]+"/"+item.mainNumUnitName):""}
                    </Text>
                  </View>
                )}
              </View>
              <View
                style={{
                  //flexDirection: 'row',
                  //justifyContent: 'space-between',
                  marginTop: 5,
                }}
              >
                <Text style={{ fontSize: 12, lineHeight: 17, color: '#666' }}>
                  {comeFrom && comeFrom == 'Refund'
                    ? `单价${item.currencySign || ''}${item.salePrice}${
                        item.mainNumUnitName ? '/' : ''
                      }${item.mainNumUnitName || ''}`
                    : `数量：${item.mainNum}${item.orderNumUnitName || ''}`}
                </Text>
                <Text style={{ fontSize: 12, lineHeight: 17, color: '#666' }}>
                  {'重量：'+(item.rowWeight?item.rowWeight:item.mainNum*item.weight)+'KG'}
                </Text>
                <Text style={{ fontSize: 12, lineHeight: 17, color: '#666' }}>
                  {comeFrom && comeFrom == 'Refund'
                    ? `退货量：${item.orderNum}`:""}
                    {/* : `主数量：${item.mainNum}${item.mainNumUnitName || ''}`} */}
                </Text>
              </View>
            </View>
          </View>
          {comeFrom && comeFrom == 'Refund' ? (
            <View
              style={{
                flexDirection: 'row',
                justifyContent: 'space-between',
                marginTop: 7,
              }}
            >
              <Text style={{ fontSize: 12, lineHeight: 17, color: '#666' }}>
                成交金额：<Text
                  style={{ fontSize: 14, lineHeight: 17, color: '#E14C46' }}
                >
                  {CURRENCY.currencySign}
                  {item.dealAmount}
                </Text>
              </Text>
              <TouchableOpacity
                onPress={() =>
                  this.props.dispatch(
                    NavigationActions.navigate({
                      routeName: 'ReturnDetail',
                      params: { detailData: item },
                    })
                  )
                }
                style={{ flexDirection: 'row' }}
              >
                <Text style={{ fontSize: 13, lineHeight: 18, color: '#999' }}>
                  详情
                </Text>
                <Icon name="icon-icon-jianjinzhishiqi" size={18} />
              </TouchableOpacity>
            </View>
          ) : (
            <View
              style={{
                flexDirection: 'row',
                justifyContent: 'space-between',
                marginTop: 7,
              }}
            >
              <Text style={{ fontSize: 12, lineHeight: 17, color: '#666' }}>
                单价：<Text
                  style={{ fontSize: 14, lineHeight: 17, color: '#666' }}
                >
                  {`${item.currencySign || ''}${item.salePrice}${
                    item.mainNumUnitName ? '/' : ''
                  }${item.mainNumUnitName || ''}`}
                </Text>
              </Text>
              <Text style={{ fontSize: 12, lineHeight: 17, color: '#666' }}>
                金额：<Text
                  style={{ fontSize: 14, lineHeight: 17, color: '#E14C46' }}
                >
                  {item.currencySign}
                  {item.amount}
                </Text>
              </Text>
            </View>
          )}
        </View>
      </View>
    )
  }

  render() {
    let comeFrom,
      arr = [1, 2, 3, 4, 5],
      imageArr = []
    if (arr.length > 3) {
      imageArr = arr.slice(0, 3)
    } else {
      imageArr = arr
    }
    if (
      this.props.navigation.state.params &&
      this.props.navigation.state.params.comeFrom
    ) {
      comeFrom = this.props.navigation.state.params.comeFrom
    }
    const { orderData } = this.props.navigation.state.params
    return (
      <View
        style={[
          styles.container,
          { backgroundColor: '#F7F7F7' },
          // { backgroundColor: appTheme.backgroundColor }
        ]}
      >
        <StatusBar
          animated={true}
          // barStyle={appTheme.barStyle}
          barStyle={'dark-content'}
          backgroundColor={'transparent'}
          translucent={true}
        />

        {/* 头部 */}
        {this.header(orderData)}

        <ScrollView
          style={{ flex: 1 }}
          scrollEventThrottle={200}
          showsHorizontalScrollIndicator={false}
        >
          {/* 流程状态 */}
          <ImageBackground
            source={StatusBacg}
            style={{ width: width, height: 55, justifyContent: 'center' }}
          >
            <View
              style={{
                flexDirection: 'row',
                justifyContent: 'space-between',
                backgroundColor: 'transparent',
                paddingHorizontal: 15,
                marginTop: 3,
              }}
            >
              <View style={{ flexDirection: 'row' }}>
                <Icon
                  name={
                    orderData && orderData.orderStatusCode
                      ? iconArr[parseFloat(orderData.orderStatusCode) - 1]
                      : iconArr[0]
                  }
                  size={32}
                  color={'#FFF'}
                  style={{ marginTop: 5 }}
                />
                <Text
                  style={{
                    fontSize: 18,
                    lineHeight: 25,
                    color: '#FFF',
                    fontWeight: 'bold',
                    marginLeft: 5,
                    alignSelf: 'center',
                  }}
                >
                  {orderData.orderStatusName}
                </Text>
              </View>
              <TouchableOpacity
                style={{ alignSelf: 'center' }}
                onPress={() =>
                  this.props.dispatch(
                    NavigationActions.navigate({
                      routeName: 'OrderLog',
                      params: {
                        logData: orderData.reqOrderLogs.sort(
                          (a, b) => b.creationTime - a.creationTime
                        ),
                      },
                    })
                  )
                }
              >
                <Text style={{ fontSize: 13, lineHeight: 17, color: '#FFF' }}>
                  操作详情>
                </Text>
              </TouchableOpacity>
            </View>
          </ImageBackground>
          {/* 流程跟踪 */}
          <View style={{ paddingHorizontal: 20, backgroundColor: '#FFF' }}>
            <ScrollView
              showsHorizontalScrollIndicator={false}
              ref={component => (this._scrollView = component)}
              horizontal={true}
              showsHorizontalScrollIndicator={false}
              overScrollMode={'auto'}
              style={{
                paddingVertical: 10,
                flexDirection: 'row',
              }}
            >
              {this.processTrack(orderData)}
              {/* {this.processTrack(orderData)} */}
            </ScrollView>
          </View>
          {/* 驳回理由 */}
          {/* {comeFrom && comeFrom == "Refund" ? (
            <View
              style={{
                padding: 10,
                backgroundColor: "#FFF",
                borderTopWidth: 1,
                borderTopColor: "#EEE"
              }}
            >
              <Text style={{ fontSize: 12, lineHeight: 17, color: "#333" }}>
                驳回原因：由于商品已经出库，不能进行退货，等客户接收后请自行手工联系退货。
              </Text>
            </View>
          ) : null} */}

          {comeFrom && comeFrom == 'Refund' ? (
            <View
              style={{
                backgroundColor: '#FFF',
                marginTop: 10,
                padding: 10,
                flexDirection: 'row',
                justifyContent: 'space-between',
              }}
            >
              <Text style={{ fontSize: 14, lineHeight: 20, color: '#333' }}>
                退货总金额
              </Text>
              <Text style={{ fontSize: 17, lineHeight: 25, color: '#E14C46' }}>
                {CURRENCY.currencySign}
                {ScaleUtil(orderData.totalReturnAmount)}
              </Text>
            </View>
          ) : null}
          {/* 选地址 */}
          {orderData.reqOrderReceiveAddress ? (
            <View
              style={{
                borderTopColor: '#EEE',
                borderTopWidth: 1 / PixelRatio.get(),
                backgroundColor: '#FFF',
                flexDirection: 'row',
                paddingTop: 10,
                paddingBottom: 5,
              }}
            >
              <View style={{ flex: 1, justifyContent: 'flex-end' }}>
                <Icon
                  name="icon-icon-dizhi"
                  size={24}
                  color={'#333'}
                  style={{ alignSelf: 'center' }}
                />
              </View>
              <View style={{ flex: 9, paddingRight: 10, paddingBottom: 5 }}>
                <View style={{ flexDirection: 'row' }}>
                  <Text style={{ fontSize: 15, lineHeight: 21, color: '#333' }}>
                    {orderData.reqOrderReceiveAddress.receiver}
                  </Text>
                  <Text style={{ marginLeft: 3, alignSelf: 'center' }}>
                    {orderData.reqOrderReceiveAddress.receiverPhone}
                  </Text>
                </View>
                <Text
                  style={{
                    marginTop: 4,
                    fontSize: 13,
                    lineHeight: 18,
                    color: '#333',
                  }}
                >
                  {(orderData.reqOrderReceiveAddress.receiverProvince || '') +
                    (orderData.reqOrderReceiveAddress.receiverCity || '') +
                    (orderData.reqOrderReceiveAddress.receiverTown || '') +
                    (orderData.reqOrderReceiveAddress.receiverAddress || '')}
                </Text>
              </View>
            </View>
          ) : null}
          {/* Image地址下边框 */}
          <Image source={redblue} style={{ height: 2, width: width }} />

          {/* 商品信息 */}
          <FlatList
            keyExtractor={(item, index) => index}
            data={orderData.reqOrderItems}
            extraData={this.state}
            renderItem={({ item, index }) =>
              this.goodsInfo(item, index, comeFrom)
            }
          />

          {/* 信息组 */}
          <View style={{ padding: 10, marginTop: 10, backgroundColor: '#FFF' }}>
            {/* 订单编号 */}
            <View
              style={{
                paddingBottom: 10,
                borderBottomColor: '#EEE',
                borderBottomWidth: 1,
              }}
            >
              <Text
                style={{
                  fontSize: 13,
                  lineHeight: 20,
                  letterSpacing: 0.16,
                  color: '#666',
                }}
              >
                {comeFrom && comeFrom == 'Refund'
                  ? `退货单编号：${orderData.orderCode}`
                  : `订单编号：${orderData.orderCode}`}
              </Text>
            </View>
            {/* 运输结算方式 */}
            <View
              style={{
                paddingVertical: 10,
                borderBottomColor: '#EEE',
                borderBottomWidth: 1,
              }}
            >
              <Text
                style={{
                  fontSize: 13,
                  lineHeight: 20,
                  letterSpacing: 0.16,
                  color: '#666',
                }}
              >
                运输方式：{orderData.transportModeName}
              </Text>
              {/* <Text
                style={{
                  fontSize: 13,
                  lineHeight: 20,
                  letterSpacing: 0.16,
                  color: '#666',
                }}
              >
                结算方式：{orderData.settleModeName}
              </Text> */}
              {/* <Text
                style={{
                  fontSize: 13,
                  lineHeight: 20,
                  letterSpacing: 0.16,
                  color: '#666',
                }}
              >
                支付方式：{orderData.underPaymentModeName}
              </Text> */}
            </View>
            {/* 发票抬头类型 */}
            {orderData.reqOrderInvoice ? (
              <View
                style={{
                  paddingVertical: 10,
                  borderBottomColor: '#EEE',
                  borderBottomWidth: 1,
                }}
              >
                <Text
                  style={{
                    fontSize: 13,
                    lineHeight: 20,
                    letterSpacing: 0.16,
                    color: '#666',
                  }}
                >
                  发票类型：{orderData.reqOrderInvoice.invoiceType}
                </Text>
                <Text
                  style={{
                    fontSize: 13,
                    lineHeight: 20,
                    letterSpacing: 0.16,
                    color: '#666',
                  }}
                >
                  发票抬头：{orderData.reqOrderInvoice.invoiceTitle}
                </Text>
              </View>
            ) : null}
            {/* 纳税人号、开户行、账号 */}
            {orderData.reqOrderInvoice ? (
              <View
                style={{
                  paddingVertical: 10,
                  borderBottomColor: '#EEE',
                  borderBottomWidth: 1,
                }}
              >
                <Text
                  style={{
                    fontSize: 13,
                    lineHeight: 20,
                    letterSpacing: 0.16,
                    color: '#666',
                  }}
                >
                  纳税人号：{orderData.reqOrderInvoice.invoiceTaxId}
                </Text>
                <Text
                  style={{
                    fontSize: 13,
                    lineHeight: 20,
                    letterSpacing: 0.16,
                    color: '#666',
                  }}
                >
                  开户行：{(orderData.reqOrderInvoice.invoiceBank || '') +
                    (orderData.reqOrderInvoice.invoiceSubBank || '')}
                </Text>
                <Text
                  style={{
                    fontSize: 13,
                    lineHeight: 20,
                    letterSpacing: 0.16,
                    color: '#666',
                  }}
                >
                  账号：{orderData.reqOrderInvoice.invoiceAccount}
                </Text>
              </View>
            ) : null}
            {/* 备注 */}
            <View
              style={{
                paddingTop: 10,
              }}
            >
              {comeFrom && comeFrom == 'Refund' ? (
                <View>
                  {/* <Text
                    style={{
                      fontSize: 13,
                      lineHeight: 20,
                      letterSpacing: 0.16,
                      color: "#666"
                    }}
                  >
                    退货日期：2018-05-06
                  </Text> */}
                  <Text
                    style={{
                      fontSize: 13,
                      lineHeight: 20,
                      letterSpacing: 0.16,
                      color: '#666',
                    }}
                  >
                    退货原因：{orderData.returnReasonName}
                  </Text>
                </View>
              ) : null}
              <Text
                style={{
                  fontSize: 13,
                  lineHeight: 20,
                  letterSpacing: 0.16,
                  color: '#666',
                }}
              >
                备注：{orderData.remark}
              </Text>
            </View>
          </View>

          {/* 商品金额 */}
          {comeFrom && comeFrom == 'Refund' ? null : (
            <View
              style={{ marginTop: 10, padding: 10, backgroundColor: '#FFF' }}
            >
              <Text style={{ fontSize: 14, lineHeight: 20, color: '#666' }}>
                商品金额：{orderData.currencySign}
                {orderData.totalAmount}
              </Text>
              <Text style={{ fontSize: 14, lineHeight: 20, color: '#666' }}>
                订单总重量：{orderData.totalWeight+'KG'}
              </Text>
              {/* <Text style={{ fontSize: 14, lineHeight: 20, color: '#666' }}>
                费用冲抵：{orderData.currencySign}
                {orderData.offsetAmount}
              </Text> */}
              <Text style={{ fontSize: 14, lineHeight: 20, color: '#666' }}>
                订单总金额：<Text style={{ color: '#E14C46' }}>
                  {orderData.currencySign}
                  {orderData.totalDealAmount+(orderData.offsetAmount?orderData.offsetAmount:0)}
                </Text>
              </Text>
            </View>
          )}
          {/* 发货信息 */}
          {comeFrom && comeFrom == 'Refund' ? (
            <View
              style={{
                padding: 10,
                marginTop: 10,
                backgroundColor: '#FFF',
              }}
            >
              <Text
                style={{
                  fontSize: 14,
                  lineHeight: 20,
                  letterSpacing: 0.17,
                  color: '#333',
                }}
              >
                退货照片
              </Text>
              <View style={{ flexDirection: 'row', paddingTop: 10 }}>
                {imageArr.map((item, index) => (
                  <Image
                    source={png}
                    style={{ width: 80, height: 80, marginRight: 10 }}
                    key={index}
                  />
                ))}
                <Text
                  style={{ fontSize: 16, alignSelf: 'center', color: '#999' }}
                >
                  ......
                </Text>
              </View>
            </View>
          ) : null
          // (
          //   <TouchableOpacity
          //     style={{
          //       padding: 10,
          //       marginTop: 10,
          //       backgroundColor: "#FFF",
          //       flexDirection: "row",
          //       justifyContent: "space-between"
          //     }}
          //   >
          //     <Text
          //       style={{
          //         fontSize: 14,
          //         lineHeight: 20,
          //         letterSpacing: 0.17,
          //         color: "#333"
          //       }}
          //     >
          //       发货信息
          //     </Text>
          //     <View style={{ flexDirection: "row" }}>
          //       <Text
          //         style={{
          //           fontSize: 14,
          //           lineHeight: 20,
          //           letterSpacing: 0.17,
          //           color: "#999"
          //         }}
          //       >
          //         查看详情
          //       </Text>
          //       <Icon
          //         size={26}
          //         color={"#CCC"}
          //         name="icon-icon-jianjinzhishiqi"
          //         style={{ marginTop: -2 }}
          //       />
          //     </View>
          //   </TouchableOpacity>
          // )
          }
        </ScrollView>

        {/* 底部 */}
        {/* {comeFrom && comeFrom == 'Refund' ? null : (
          <View
            style={{
              height: 45,
              backgroundColor: '#FFF',
              flexDirection: 'row',
            }}
          >
            {this.bottomTouch(orderData)}
          </View>
        )} */}
      </View>
    )
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
  },
  text333: {
    fontSize: 14,
    lineHeight: 20,
    letterSpacing: 0.17,
    color: '#333',
  },
  text666: {
    fontSize: 13,
    lineHeight: 18,
    color: '#666',
  },
  text666red: {
    fontSize: 14,
    lineHeight: 25,
    color: '#E14C46',
  },
  text999: {
    fontSize: 12,
    lineHeight: 17,
    color: '#999',
  },
})

export default OrderDetail