<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="https://www.thymeleaf.org" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
      xsi:schemaLocation="https://www.thymeleaf.org ">
<head>
    <title>采美365网-中国美业全方位线上交易服务互动平台，做美业，上采美</title>
    <template th:replace="components/head-link"></template>
    <link th:href="@{/css/base/center.css(v=${version})}" rel="stylesheet" type="text/css">
    <link th:href="@{/css/supplier-center/delivery.css(v=${version})}" rel="stylesheet" type="text/css">
</head>
<body>
<!-- 引用头部 -->
<template th:replace="components/header"></template>

<!-- 我的采美 -->
<div id="delivergoods">
    <div class="navLayout">
        <div class="crumbs" v-if="isPC">
            <span>我的交易</span>
            <span>&gt;</span>
            <span>我的订单</span>
            <span>&gt;</span>
            <span>发货</span>
        </div>
        <div v-else class="wrap_tittle mIcon" @click="opentittle">
            <i class="mIcon open"></i><span style="margin-left: 25px;">发货</span>
        </div>
        <div class="wrap clear ">
            <!--左侧面包屑-->
            <div v-show="open">
                <template th:replace="supplier-center/components/tableft"></template>
            </div>
            <div class="right">
                <div class="userinfo">
                    <p class="info">
                        <span>买家信息</span>
                        <button type="button" class="comback" @click="history.go(-1)">返回</button>
                    </p>
                    <div class="user">
                        <p>买家名称：<span>{{userInfo.name}}</span></p>
                        <p>收货人：<span>{{userInfo.shouHuoRen}}</span></p>
                        <p>联系方式：<span>{{userInfo.mobile}}</span></p>
                    </div>
                    <p class="address">收货地址：<span>{{userInfo.address}}</span></p>
                </div>

                <div class="goods-info">
                    <div class="protitle">商品信息</div>
                    <form action="">
                        <div class="goods-list" v-for="order in productList">
                            <div class="goods-btn">
                                <input type="checkbox" name="goodList" class="goods-inp"  v-model="check"
                                       @change="computedPrice(order)"/>
                            </div>
                            <div class="goods">
                                <div class="goods_img">
                                    <img :src="order.productImage"/>
                                </div>
                                <div class="goods_item">
                                    <h3 class="sp-order-name">{{order.name}}</h3>
                                    <p>
                                        <span>规格：{{order.productUnit}}</span>
                                        <span>已发数量:{{order.shipmentsNum}}</span>
                                        <span>未发数量：{{order.notOutStore - order.actualCancelNum}}</span>
                                        <span>购买数量：{{order.num + order.presentNum}}</span>
                                    </p>
                                    <div class="delivery-btn">
                                        <div class="delivery-number">
                                            <span class="red">*</span>本次发货：
                                            <span class="sp-delivery-cal sp-delivery-reduce" @click="changeCountSub(order)">-</span>
                                            <input type="number" class="del-num" v-model="inputVal" />
                                            <span class="sp-delivery-cal sp-delivery-add" @click="changeaddCount(order)">+</span>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="allcheck">
                            <div class="all-election">
                                <input type="checkbox" @change="ckeckAll()" v-model="allChecked"/>
                                全选
                            </div>
                            <div class="delivery-button">
                                <button class="delivery" type="button" @click="delivery">发货</button>
                                <button class="false-btn" type="button">取消</button>
                            </div>
                        </div>
                    </form>
                </div>

            </div>
        </div>

    </div>

</div>

<!-- 引入底部 -->
<template th:replace="components/footer"></template>
<template th:replace="components/foot-link"></template>
<script charset="utf-8" type="text/javascript"
        th:src="@{/js/common/serviceapi/supplier.service.js(v=${version})}"></script>
<script charset="utf-8" type="text/javascript" th:src="@{/js/supplier-center/delivergoods.js(v=${version})}"></script>
</body>
</html>
