<!--
  @description:再次购买--结算页
  @Modifier: haofengxian
  @routerPath:
  @date: 2021-12-05 16:29
-->
<template>
  <el-dialog
    v-loading="loading"
    :visible.sync="visibleDialog"
    :fullscreen="true"
    custom-class="shop_mall_dialog"
    title="再次购买结算"
  >
    <div class="middle_width1200">
      <div class="check_order_info">
        填写并核对订单信息
      </div>
      <div class="settle_wrap">
        <!--收货人信息-->
        <div class="step_tit clearfix">
          <h3 class="fl" style="font-size:16px;">
            收货人信息
          </h3>
          <div class="add_address fr">
            <span class="pointer" @click="addAddressClickBtn">
              <img src="@assets/img/shopmall/settle-icon3.png">
              新增地址
            </span>
          </div>
        </div>
        <!--收货地址-->
        <div class="step_cont">
          <el-scrollbar
            :class="showAll ? 'scrollbar_all' : ''"
            class="scrollbar_wrap scrollbar"
          >
            <el-row class="invoiceManageList">
              <el-col v-for="(item,index) in personList" :key="index" :span="5" :offset="1">
                <div :class="{ 'children': true, 'acitve':item.isDefault === true, 'gray':item.isDefault === false,'selected': item.id === selectID}">
                  <div class="invoiceManageInfo mailingaddress pointer" title="点击地址框，选中地址" @click="selectAddress(item, index)">
                    <div class="receiver_name">
                      <div class="name" :title="item.receiverName">
                        {{ item.receiverName }}
                      </div>
                      <span @click="updateClickBtn(item.id)">编辑</span>
                      <span @click="addressDelete(item.id)">删除</span>
                    </div>
                    <p>
                      <span style="margin-left: 0px;">{{ item.phoneNumber }}</span>
                    </p>
                    <p>
                      <span style="margin-left: 0px;">{{ item.provinceName }}&nbsp;{{ item.cityName }}&nbsp;{{ item.areaName }}</span>
                    </p>
                    <p class="name" :title="item.addressDetail">
                      <span style="margin-left: 0px;">{{ item.addressDetail }}</span>
                    </p>
                  </div>
                </div>
              </el-col>
            </el-row>
          </el-scrollbar>
          <div
            v-if="personList && personList.length > 4"
            class="addr_switch switch_on"
            @click="showConsigneeAll"
          >
            <span>{{ showAll ? "收起地址" : "更多地址" }}</span>
            <i :class="showAll ? 'el-icon-arrow-up' : 'el-icon-arrow-down'" />
          </div>
        </div>
        <!-- 采购计划
        <div class="procurement-wrap">
          <div style="font-weight: 600;font-size:16px;">
            采购项目
          </div>
          <div class="content-wrap mb10" style="border-bottom:0;">
            <span
              v-if="taskPlanData.length === 0"
              style="color:#1f94f4;margin-top: 10px;display: block;cursor:pointer;"
              @click="showconsigProject"
            >请选择</span>
            <span v-if="taskPlanData.length !== 0" style="color:#1f94f4;margin-top: 10px;display: block;cursor:pointer;" @click="showconsigProject">重新选择</span>
          </div>
          <div v-if="taskPlanData.length !== 0" class="content-wrap-list">
            <el-table
              :data="taskPlanData"
              tooltip-effect="dark"
              style="width: 100%"
            >
              <el-table-column
                prop="tenderName"
                label="项目名称"
                min-width="120"
              />
              <el-table-column
                prop="tenderNo"
                label="项目编号"
                min-width="150"
              />
              <el-table-column
                prop="tenderType"
                label="项目类型"
                min-width="100"
                align="center"
              />
              <el-table-column
                label="发布日期"
                min-width="120"
                align="center"
              >
                <template slot-scope="scope">
                  {{ $Moment(scope.row.createTime).format(momentDate) }}
                </template>
              </el-table-column>
              <el-table-column
                fixed="right"
                label="操作"
                width="120"
              >
                <template slot-scope="scope">
                  <el-button
                    type="text"
                    size="small"
                    @click.native.prevent="deleteRow(scope.$index, taskPlanData)"
                  >
                    移除
                  </el-button>
                </template>
              </el-table-column>
            </el-table>
          </div>
        </div> -->
        <div class="procurement-wrap">
          <div class="clearfix">
            <h3 class="fl" style="font-size:16px;">
              发票管理
            </h3>
            <div class="add_address fr pointer" @click="addClick">
              <img src="@/assets/img/shopmall/settle-icon3.png">
              新增发票
            </div>
          </div>
          <div class="content-wrap mb10 mt10 pointer font-color" @click="showconsigInvoice">
            <p v-if="invoiceTableData.length === 0">
              <img src="@/assets/img/shopmall/settle-icon1.png">
              请选择
            </p>
            <p v-if="invoiceTableData.length !== 0">
              <img src="@/assets/img/shopmall/settle-icon1.png">
              重新选择
            </p>
          </div>
          <div v-if="invoiceTableData.length !== 0" class="content-wrap-list">
            <el-table
              :data="invoiceTableData"
              tooltip-effect="dark"
              style="width: 100%"
              :stripe="false"
              :border="false"
              class="shop_mall_invoiceTable"
            >
              <el-table-column label="发票抬头">
                <template slot-scope="scope">
                  {{
                    scope.row.invoiceTitle
                  }}
                </template>
              </el-table-column>
              <el-table-column
                prop="invoiceType"
                label="发票类型"
              />
              <el-table-column
                prop="taxpayerIdentificationNumber"
                label="发票税号"
              />
              <el-table-column
                prop="createName"
                label="发票管理员"
              />
              <el-table-column
                prop="taxpayertel"
                label="注册电话"
              />
              <el-table-column
                prop="bankname"
                label="发票开户银行"
              />
              <el-table-column
                prop="bankaccount"
                label="发票银行账号"
              />
              <el-table-column
                prop="taxpayeraddr"
                label="注册地址"
              />
            </el-table>
          </div>
        </div>
        <!--对比商品-->
        <!-- <div class="procurement-wrap">
          <div style="font-weight: 600;">
            商品对比
          </div>
          <div class="content-wrap">
            <span style="color:#1f94f4;margin-top: 10px;display: block;cursor:pointer;" @click="showconsigContrasts"><p v-if="conteastData.length===0">请选择</p><p v-if="conteastData.length!==0">重新选择</p></span>
          </div>
          <div v-if="conteastData.length!==0" class="content-wrap-list">
            <li v-for="(item,index) in invoice" :key="index"><span>{{ item.invoiceTitle }}</span></li>
            <el-table
              :data="conteastData"
              tooltip-effect="dark"
              style="width: 100%"
            >
              <el-table-column
                label="商品名称"
              >
                <template slot-scope="scope">{{ scope.row.productName | ellipsis }}</template>
              </el-table-column>
               <el-table-column
                label="商品图片"
              >
                <template slot-scope="scope"><img :src="scope.row.productPicture" style="height: 100px;width: 100px"></template>
              </el-table-column>
              <el-table-column
                prop="brandName"
                label="品牌名称"
/>
              <el-table-column
                prop="commodityPrice"

                label="商品价格"/>
              <el-table-column
                prop="marketPrice"
                label="商品市场价"/>
              <el-table-column
                prop="salesQuantity"
                label="销量"/>
              <el-table-column
                prop="supplierName"
                label="供应商名称"/>
             <el-table-column
                label="规格参数">
                <template slot-scope="scope"> <div v-html="scope.row.spces"/></template>
              </el-table-column>
            </el-table>
          </div>
        </div> -->
        <!--确认订单信息-->
        <div class="shop_info_wrap">
          <div class="clearfix">
            <div class="shop_info_tit fl">
              确认订单信息
            </div>
            <!-- <div class="fr">
              <router-link to="/shop/myshoppingCart">
                <img src="@/assets/img/shopmall/settle-icon2.png">
                <span class="font-color">
                  返回修改购物车
                </span>
              </router-link>
            </div> -->
          </div>
          <div class="shop_info_tabs">
            <div>商品信息</div>
            <div>
              <div>单价</div>
              <div>数量</div>
              <div>小计</div>
            </div>
          </div>
          <div
            v-for="(item, indexs) in resultList"
            :key="indexs"
            class="shop_info_inner"
          >
            <div class="store">
              店铺：
              <span class="depart_name">{{ item.departName }}</span>
            </div>
            <div
              v-for="(ele, index) in item.productsList"
              :key="index"
              class="ds_content"
              style="background-color:#FFF;"
            >
              <div v-if="ele.checked" class="content_item clearfix">
                <div class="clearfix-left">
                  <div class="fl goods_detail" @click="goToDetail(ele)">
                    <span class="shop_image goods_img">
                      <img :src="ele.productPicture">
                    </span>
                    <span class="shop_goods_name goods-name" :title="ele.goodsName">{{
                      ele.goodsName
                    }}</span>
                  </div>
                  <div class="fr shop_right_price list_row">
                    <span class="unit_price list_col">{{ ele.unitPrice }}</span>
                    <span class="number list_col">x {{ ele.number }}</span>
                    <span
                      class="list_col"
                    >{{ ele.unitPrice.mul(ele.number) }}</span>
                  </div>
                </div>

                <!-- <div class="procurement-contrast">
                  <div v-if="conteastData.length !== 0">
                    <div v-for="(str, indes) in conteastData" :key="indes">
                      <div v-if="ele.goodsId === str.goodsIds">
                        <p>对比商品名称：{{ str.productName }}</p>
                        <p>
                          对比商品金额：{{ str.commodityPrice || str.price }}
                        </p>
                      </div>
                    </div>
                  </div>
                  <div>
                    <button
                      style="background:#FF6600;color:#fff;font-size: 14px;width:80px;height:30px;border:0;margin-left:5px;"
                      @click="showconsigContrasts(ele, item)"
                    >
                      商品对比
                    </button>
                  </div>
                </div> -->
              </div>
            </div>
            <div class="shop_info_allPrice">
              店铺合计
              <span class="sub_total">
                ¥ {{ item.productsList | allPrice }}
              </span>
            </div>
          </div>
        </div>
        <!--送货信息-->
        <div class="pay_and_shipment_cont">
          <div class="pay_info_wrap" style="background-color:#FFF;">
            <div>
              应付金额（含税）：
              <!-- <span class="tax_inclusive">（含税）</span> -->
              <span
                class="order_amount"
              >￥{{ Number(formData.orderAmount).toFixed(2) }}</span>
            </div>
            <div>
              <span style="margin-right:20px">寄送至：{{ checkedAddress }}</span><span style="margin-right:20px">收货人：{{ receiverName }}</span><span>{{ phoneNumber }}</span>
            </div>
          </div>
          <button class="checkout_submit" @click="print">
            打印
          </button>
          <button class="checkout_submit" @click="saveOrders">
            申购
          </button>
        </div>
      </div>

      <!--添加收货地址弹框组件-->
      <addressAdd v-if="childenData.dialog" :childen-data="childenData" @updateList="initAddressList" />
      <!--采购计划-->
      <addressProject
        v-if="childensData.dialog"
        :childens-data="childensData"
        @wathData="wathData"
      />
      <!--发票管理-->
      <selectInvoice
        ref="selectInvoice"
        :children-invoice="childrenInvoice"
        @childrenInvoices="childrenInvoices"
      />
      <!--商品id-->
      <addressContrast
        v-if="childrenContrast.dialog"
        :children-contrast="childrenContrast"
        @childrenContrasts="childrenContrasts"
      />
      <!-- 新增发票 -->
      <invoiceAdd v-if="invoiceChildenData.dialog" :data="invoiceChildenData" />
    </div>
  </el-dialog>
</template>

<script>
// api
import { saveOrders, shopCarExport } from '@api/shoppingmall/order'
import { getList, deleteAdress } from '@/api/shoppingmall/mailingaddress'
import addressAdd from '@views/shoppingmall/mailingaddress/mailingaddressAdd-dialog'
import addressProject from '@views/shoppingmall/mailingaddress/mailingaddressProject-dialog'
import selectInvoice from '@views/shoppingmall/invoice/selectInvoice-dialog'
import addressContrast from '@views/shoppingmall/mailingaddress/mailingaddressContrast-dialog'
import invoiceAdd from '@views/shoppingmall/invoice/invoicesAdd-dialog.vue'
import { Loading } from 'element-ui'
import { download } from '@assets/js/utils'// 常用方法
export default {
  name: 'OnceAgainPurchaseCart',
  components: {
    addressAdd,
    addressProject,
    selectInvoice, // 选择发票
    addressContrast,
    invoiceAdd
  },
  filters: {
    ellipsis(value) {
      if (!value) return ''
      if (value.length > 10) {
        return value.slice(0, 10) + '...'
      }
      return value
    },
    allPrice(val) {
      if (!val) return 0
      let res = 0
      val.forEach(item => {
        // 只计算选中的商品
        if (item.checked) {
          res = res.add(item.totalPrice)
        }
      })
      return res
    }
  },
  data() {
    return {
      visibleDialog: false,
      fullscreenLoading: false,
      // 发票信息弹框
      childrenInvoice: {
        dialog: false,
        selectedInvoice: []
      },
      childrenContrast: {
        dialog: false,
        goodsId: ''
      },
      childensData: {
        dialog: false
      },
      childenData: {
        dialog: false, // 弹框
        type: '', // 00 编辑 01 增加
        id: ''
      },
      stepsActive: 1, // 传给子组件步骤条选中状态
      // 更多地址修改样式
      showAll: false,
      formData: {}, // 提交订单数据
      resultList: [], // 商品列表
      addressId: '', // 地址id
      personList: [], // 收货人列表
      checkedAddress: '', // 寄送至地址
      buyerType: '', // 结算类型
      listJectr: [],
      invoice: [],
      receiverName: '',
      phoneNumber: '',
      taskPlanData: [], // 采购计划数据
      invoiceTableData: [], // 发票数据
      conteastData: [], //  商品对比数据
      listLength: [],
      // 选中的收货地址id
      selectID: '',
      // 新增发票
      invoiceChildenData: {
        dialog: false, // 弹框
        type: '', // 00 编辑 01 增加
        status: '',
        id: ''
      },
      loading: false
    }
  },
  watch: {
    'visibleDialog'(val) {
      if (!val) {
        this.invoiceTableData.length = 0
        this.formData.invoicesId = ''
      }
    }
  },
  methods: {
    // 结算
    openDialogSettle() {
      this.visibleDialog = true
      // 购物车下单/立即购买结算
      this.shoppingCartOrder()
      // 获取地址列表
      this.initAddressList()
    },
    // 购物车下单/立即购买结算
    shoppingCartOrder() {
      const resultList = []
      // 购物车下单
      this.buyerType = '03'
      const formData = JSON.parse(sessionStorage.getItem('formData'))
      const list = JSON.parse(sessionStorage.getItem('list'))
      list.forEach((val, index) => {
        if (val.checked) {
          // 如果全部选中，则全部添加
          resultList.push(val)
        } else {
          // 如果没有选中，判断子集有没有选中，只保留选中的子集
          const arrayFromList = val.productsList.filter(ele => ele.checked)
          const len = arrayFromList.length
          // 有选中的子集
          if (len) {
            val.productsList = arrayFromList.slice(0)
            resultList.push(val)
          }
        }
      })
      this.resultList = resultList
      this.formData = formData
      this.resultList = Array.from(new Set(this.resultList))
      sessionStorage.setItem('resultList', JSON.stringify(this.resultList))
    },
    // 移除
    deleteRow(index, rows) {
      rows.splice(index, 1)
    },
    childrenContrasts(val) {
      this.conteastData.forEach(ele => {
        if (ele.goodsIds === val.goodsIds) {
          this.conteastData.splice(this.conteastData.indexOf(ele), 1)
        }
      })
      this.conteastData.push(val)
    },
    // 采购计划信息
    wathData(val) {
      // 采购计划信息数组为空的时候
      if (this.taskPlanData.length === 0) {
        // 遍历
        val.forEach(item => {
          // 把每条数据推入采购计划信息数组内
          this.taskPlanData.push(item)
        })
      } else {
        val.forEach(item => {
          this.taskPlanData.push(item)
          // 定义一个新的对象,保存过滤出的数据
          const newobj = {}
          // 采购计划信息数组通过id进行数据去重
          this.taskPlanData = this.taskPlanData.reduce((item, next) => {
            // 判断是否有重复的id
            if (!newobj[next.id]) {
              item.push(next)
              newobj[next.id] = true
            }
            return item // 不重复的数据
          }, [])
        })
      }
      const obj = []
      val.forEach(ele => {
        obj.push(ele.id)
      })
      this.formData.planId = obj.join(',')
    },
    // 采购计划弹框
    showconsigProject() {
      this.childensData = {
        dialog: true
      }
    },
    showconsigContrasts(ele) {
      this.childrenContrast = {
        dialog: true,
        goodsId: ele.goodsId || ele.id
      }
    },
    // 更多地址
    showConsigneeAll() {
      if (this.showAll) {
        this.showAll = !this.showAll
      } else {
        this.showAll = !this.showAll
      }
    },
    // 选择邮寄地址
    changeAddress(item, index) {
      this.personList.splice(index, 1)
      this.personList.unshift(item)
      this.checkedAddress = item.address
      this.addressId = this.personList[0].id
      this.receiverName = item.receiverName
      this.phoneNumber = item.phoneNumber
    },
    // 提交订单
    saveOrders() {
      if (
        this.addressId &&
          // this.taskPlanData.length &&
          this.invoiceTableData.length
      ) {
        this.formData.buyerType = this.buyerType
        this.formData.addressId = this.addressId
        this.$confirm('确认提交订单？', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          confirmButtonClass: 'confirmBtn',
          cancelButtonClass: 'cancelBtn',
          type: 'warning'
        }).then(() => {
          this.loading = true
          const buyParamDtos = []
          let buyParamOrderInfo = {
            num: 0,
            orderDetailId: '',
            unitPrice: 0
          }
          this.resultList.map((item) => {
            item.productsList.map((ele) => {
              buyParamOrderInfo = {
                orderDetailId: ele.id,
                unitPrice: ele.unitPrice,
                num: ele.number
              }
              buyParamDtos.push(buyParamOrderInfo)
            })
          })
          this.formData.buyParamDtos = buyParamDtos
          saveOrders(this.formData).then(res => {
            this.$message({
              type: 'success',
              message: '提交订单成功!'
            })
            this.loading = false
            const orderON = JSON.parse(res.data).orderNo
            this.$router.replace({
              path: '/shop/cashier',
              query: { number: orderON }
            })
          }).catch((err) => {
            this.loading = false
            throw new Error(err)
          })
        }).catch(() => {
        })
      } else {
        if (this.addressId) {
        } else {
          this.$message({
            type: 'warning',
            message: '请添加收货地址'
          })
        }
        // if (this.taskPlanData.length) {
        //   // console.log('tag', '')
        // } else {
        //   this.$message({
        //     type: 'warning',
        //     message: '请添加采购计划'
        //   })
        // }
        if (this.invoiceTableData.length) {
        } else {
          this.$message({
            type: 'warning',
            message: '请选择发票'
          })
        }
      }
    },
    // 商品详情图片
    goToDetail(val) {
      if (this.$route.query.from === 'myshoppingCart') {
        this.$router.push({
          path: '/shop/goodsClassDetail',
          query: { id: val.goodsId }
        })
      } else {
        this.$router.push({ path: '/shop/goodsClassDetail', query: { id: val.id }})
      }
    },

    /* ====================地址 Start=====================*/
    // 修改地址
    updateClickBtn(id) {
      this.childenData = {
        dialog: true,
        type: '00',
        id: id // 00 修改
      }
    },
    // 删除地址
    addressDelete(id) {
      this.$confirm('是否确认删除?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        deleteAdress(id).then(res => {
          this.$message({
            message: '删除地址成功',
            type: 'success'
          })
          this.initAddressList()
        }).catch(err => {
          throw new Error('删除地址失败' + err)
        })
      }).catch(() => {
      })
    },
    // 添加地址
    addAddressClickBtn() {
      this.childenData = {
        dialog: true,
        type: '01' // 01 新增
      }
    },
    // 选择邮寄地址
    selectAddress(item) {
      // this.personList.splice(index, 1)
      // this.personList.unshift(item)
      // this.addressId = this.personList[0].id
      // this.selectID = this.personList[0].id
      this.addressId = item.id
      this.selectID = item.id
      this.checkedAddress = item.address
      this.receiverName = item.receiverName
      this.phoneNumber = item.phoneNumber
    },
    // 获取地址列表
    initAddressList() {
      getList().then(response => {
        this.personList = response.data
        if (this.personList.length > 0) {
          this.personList.forEach((val, index) => {
            // 将默认地址挪到第一个
            if (val.status === '00') {
              this.personList.splice(index, 1)
              this.personList.unshift(val)
            }
          })
          this.checkedAddress = this.personList[0].address
          this.addressId = this.personList[0].id
          this.selectID = this.personList[0].id
          this.receiverName = this.personList[0].receiverName
          this.phoneNumber = this.personList[0].phoneNumber
        }
      }).catch(() => {})
    },
    /* ====================地址 End=====================*/
    /* ====================发票 Start=====================*/
    // 发票信息
    childrenInvoices(val) {
      this.invoiceTableData = val
      if (this.invoiceTableData.length !== 0) {
        this.formData.invoicesId = val[0].id
      }
    },
    // 发票管理弹框
    showconsigInvoice() {
      this.childrenInvoice = {
        dialog: true,
        selectedInvoice: this.invoiceTableData
      }
    },
    // 新增发票
    addClick() {
      this.invoiceChildenData = {
        dialog: true,
        type: '01', // 01 新增
        status: '00'
      }
    },
    /* ====================发票 End=====================*/
    // 打印
    print() {
      if (this.addressId && this.invoiceTableData.length) {
        this.$confirm('确认打印？', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          confirmButtonClass: 'confirmBtn',
          cancelButtonClass: 'cancelBtn',
          type: 'warning'
        }).then(() => {
          const resList = []
          this.resultList.forEach(item => {
            item.productsList.forEach(ele => {
              resList.push(ele)
            })
          })
          const params = {
            addressId: this.addressId,
            invoicesId: this.invoiceTableData[0].id,
            // 购物车 00 结算页 01
            printType: '01',
            productsList: resList
          }
          const loadingInstance = Loading.service()
          shopCarExport(params).then(res => {
            loadingInstance.close()
            const filename = '购物车商品列表' + '.pdf'
            download(res, filename)
            this.$message({
              type: 'success',
              message: '打印成功!'
            })
          }).catch(() => {
            loadingInstance.close()
          })
        }).catch(() => {
        })
      } else {
        if (this.addressId) {
        } else {
          this.$message({
            type: 'warning',
            message: '请添加收货地址'
          })
        }
        // if (this.taskPlanData.length) {
        //   // console.log('tag', '')
        // } else {
        //   this.$message({
        //     type: 'warning',
        //     message: '请添加采购计划'
        //   })
        // }
        if (this.invoiceTableData.length) {
        } else {
          this.$message({
            type: 'warning',
            message: '请选择发票'
          })
        }
      }
    }
  }
}
</script>

<style scoped lang="less">
@import "../../shoppingcart/index";
.font-color{
  color: @hyacinthine;
  font-size: 12px;
}
.clearfix-left {
  flex: 6;
  display: flex;
  align-items: center;
}
.content_item {
  width: 100%;
  display: flex;
  align-items: center;
  border: 1px solid #F2F2F2;
  border-bottom: none;
}
.procurement-contrast {
  flex: 4;
  display: flex;
  justify-content: flex-end;
  align-items: center;
}
.goods_detail {
  flex: 1;
  display: flex;
  align-items: center;
  //.shop_goods_name {
  //  width: 200px;
  //}
}
.goods-name {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}
.goods-name:hover {
  color:@orange;
}
.list_row {
  display: flex;
  width: 500px;
  align-items: center;
  margin-right: 0px;
  .list_col {
    flex: 1;
    align-items: center;
    margin-right: 0px !important;
    text-align: center;
    line-height: normal;
    color: #555 !important;
  }
}
.settle_wrap .shop_info_wrap .goods_img {
  margin-right: 40px;
  >img {
    width: 76px !important;
    height: 76px !important;
    margin: 2px 0 0 2px;
  }
}
.receiver_name {
  display: flex;
  border-bottom: 1px solid #F2F2F2;
  line-height: 24px;
  padding-right: 6px;
  margin-bottom: 5px;
  >div{
    flex: 1;
  }
  >span{
    position: relative;
    &:hover{
      color: @hyacinthine;
      cursor: pointer;
    }
  }
}
.invoiceManageList {
  >div:nth-child(4n+1) {
    margin-left: 0;
  }
}
.depart_name {
  background-color: @french-orange;
  border-radius: 4px;
  border-width: 0px;
  color: #FFFFFF;
  padding: 1px 5px;
}
.shop_info_tabs {
  display: flex;
  height: 32px;
  line-height: 32px;
  padding: 0 8px;
  background-color: #F2F2F2;
  >div:first-child {
    flex: 1;
    text-align: center;
  }
  >div:last-child {
    width: 500px;
    display: flex;
    padding-right: 30px;
    >div {
      flex: 1;
      text-align: center;
    }
  }
}
.shop_info_allPrice {
  background-color: #FBFCFF;
  line-height: 40px;
  height: 40px;
  padding: 0 30px 10px 0;
  text-align: right;
  font-size: 13px;
  border: 1px solid #F2F2F2;
  >span {
    //font-size: 14px;
    margin-left: 5px;
    color: @orange;
    font-weight: 650;
  }
}
.shop_mall_invoiceTable {
  /deep/ th.is-leaf {
    border: none;
    padding: 5px 0;
    font-weight: 400;
  }
  /deep/ th {
    background-color: #F2F2F2;
  }
  /deep/ td {
    border-bottom: 1px solid #F2F2F2;
  }
}
.name{
  white-space: nowrap;
  word-break: break-all;
  overflow: hidden;
  text-overflow: ellipsis;
}
</style>
