
import { useState } from "react";
import Taro from '@tarojs/taro'
import image from '@/assets/icons/ProCard/8kb.jpg'
import food from '@/assets/icons/ProCard/food.png'
import ProCard_hot from '@/assets/icons/ProCard/ProCard_hot.png'
import withLayout from '@/layouts'

import Null from '@/assets/icons/UserCenter/null_logo.png'
import Refund from '@/assets/icons/UserCenter/Refund.png'

import starOn from '@/assets/icons/GuideCheck/starOn.png'
import starOff from '@/assets/icons/GuideCheck/starOff.png'




import CustomNav from '@/components/CustomNav'
import './style.less'


const scoreList = new Array(5).fill(0)
const score = '3.9'
export default withLayout((props) => {
  const { router, person } = props

  const handleRefund2 = () => {
    Taro.navigateTo({ url: '/pages/MineUserAll/RefundMoney/CheckRefund/index' })
  }
  return (
    <view className='box-content'>
      <CustomNav title='售后退款' />
      <view class='wrapper'>
        <view class='left-complete-one'>
          <image className='left-image-1' src={ProCard_hot}></image>
          <view className='left-viewText'>
            返现￥16.00
          </view>
          {/* 评分 */}
          <view className='card-box-star'>
            {
              scoreList.map((_, index) => {

                const src = (index + '0.1') < score ? starOn : starOff
                return (
                  <image className='card-star-image' key={index} src={src} />
                )
              })
            }
            <text className='card-star-text' >{score}</text>
          </view>
          <view className='title-image'>
            <image className='image-1' mode='scaleToFill' src={image}></image>
            <image className='image-2' src={food}></image>
          </view>
          <view className='title-content'>
            <view className='Pro-title'>
              <view className='title-text'>【米啊糯】新街口店 <text className='title-money-2' >数量：1张</text></view>
            </view>
            <text className='title-money' >￥6990元</text>
            <view className='title-time' >有效期：2021/06/21  14:00</view>
          </view>
        </view>
        <view class='right-complete-two' onClick={handleRefund2} >
          <view className='right-content'>
            <image className='right-image' src={Refund} />
            <view className='right-title'>售后</view>
          </view>
        </view>
      </view>
      {/* 已核销 */}
      <view class='wrapper'>
        <view class='left-complete-one'>
          <image className='left-image-1' src={ProCard_hot}></image>

          <view className='left-viewText'>
            返现￥16.00
          </view>
          {/* 评分 */}
          <view className='card-box-star'>
            {
              scoreList.map((_, index) => {

                const src = (index + '0.1') < score ? starOn : starOff
                return (
                  <image className='card-star-image' key={index} src={src} />
                )
              })
            }
            <text className='card-star-text' >{score}</text>
          </view>
          <view className='title-image'>
            <image className='image-1' mode='scaleToFill' src={image}></image>
            <image className='image-2' src={food}></image>
          </view>
          <view className='title-content'>
            <view className='Pro-title'>
              <view className='title-text'>【米啊糯】新街口店 <text className='title-money-2' >数量：1张</text></view>
            </view>
            <text className='title-money' >￥6990元</text>
            <view className='title-time' >有效期：2021/06/21  14:00</view>
          </view>
        </view>
        <view class='right-complete-two' onClick={handleRefund2} >
          <view className='right-content'>
            {/* <image className='right-image-two' src={Null} /> */}
            <image className='right-image' src={Refund} />
            <view className='right-title'>售后</view>
          </view>
        </view>
      </view>
      <view className='foot'>
        已经到底了~
      </view>
    </view>
  )
})
