<template>
  <v-header title="购物车" mode="">
    <view class="screen_all flex" v-if="isLogin">
      <view class="flex-all-1 overflow flex">
        <view class="car-header row aCenter">
          <view class="flex-all-1 row">
            <view class="row aCenter" @click="routerHome">
              <image src="/static/images/shop.png" class="car-header-icon"></image>
              <view class="car-shop-label">{{config.name}}</view>
              <text class="iconfont iconfont-more car-header-more"></text>
            </view>
          </view>
          <view @click="triggerEdit" class="car-header-edit">{{edit?'完成':'编辑'}}</view>
        </view>
        <view class="flex-all-1 overflow">
          <flat-list
            background="transparent"
            @changeData="flatChangeData"
            @fetch="fetch"
            :ref="base_flat_id"
            emptyText="购物车空空如也"
          >
            <view class="car-padding">
              <view class="car-shop row aCenter"
                    v-for="(item,index) in base_flat_data.data"
                    :key="index"
                    @click.stop="triggerSelect(item)"
                    v-if="!base_flat_remove[item.id]"
              >
                <v-radio disabled :value="!!selectObject[item.id]" borderColor="#999999" class="car-shop-radio"  activeBorderColor="#41AE3C" activeColor="#41AE3C"></v-radio>
                <view class="flex-all-1 overflow">
                  <layout-shop-item
                      :item="item"
                      numberEdit
                      type="car"
                      @input="triggerInput"
                      @change="triggerChange"
                  ></layout-shop-item>
                </view>
              </view>
            </view>
          </flat-list>
        </view>
      </view>
      <view v-show="!empty" class="car-footer row aCenter">
        <view @click="triggerAllSelect" class="row aCenter">
          <v-radio :value="allSelect" disabled size="small" class="car-footer-radio" borderColor="#999999"  activeBorderColor="#41AE3C" activeColor="#41AE3C"></v-radio>
          <text>全选</text>
        </view>
        <view class="flex-all-1"></view>
        <view v-if="!edit" class="car-footer-right row aCenter">
          <view>合计:</view>
          <view class="car-footer-price">¥{{total}}</view>
        </view>
        <view v-if="edit" class="car-footer-button center" @click="deleteCheckShop">删除</view>
        <view v-else class="car-footer-button center" @click="triggerOrder">结算</view>

      </view>
    </view>
    <view class="screen_all center" v-else>
      <view @click="routerLogin" class="cart-button center">授权登录</view>
    </view>
  </v-header>
</template>

<script>
import vHeader from '@/components/v-header/main';
import vRadio from '@/components/v-radio/main';
import flatList from '@/components/flat-list/src/main';
import mixins from './mixins';
import layoutShopItem from '../../layout/layout-shop-item/main';
import { mapState } from 'vuex';
export default {
  components:{
    vHeader,
    vRadio,
    flatList,
    layoutShopItem
  },
  mixins,
  computed:mapState(['config'])
}
</script>

<style lang='scss' scoped src="./style.scss">

</style>
