<!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/shop/brand.css(v=${version})}" rel="stylesheet" type="text/css">
</head>
<body>
<!-- 引用头部 -->
<template th:replace="components/header"></template>
<h1></h1>
<!-- 我的采美 -->
<div id="Brandgoods">
    <div class="navLayout" v-cloak>
        <div class="crumbs" v-if="isPC">
            <span>我的店铺</span>
            <span>&gt;</span>
            <span>品牌管理</span>
        </div>
        <div class="wrap clear">
            <!--左侧面包屑-->
            <template th:replace="supplier-center/components/tableft"></template>
            <div class="right">
                <div class="head-top">
                    <form action="">
                        <div class='order-border'>
                            <span>品牌名称：</span>
                            <input type="text" id="name-buyer" v-model="params.name" class="Buyer" placeholder="请输入买家名称">
                        </div>
                        <div>
                            状态：
                            <select name="" id="settlement-status" class="state" @change="getstatus($event)">
                                <option value="">全部</option>
                                <option value="0">待审核</option>
                                <option value="1">审核通过</option>
                                <option value="2">审核未通过</option>
                            </select>
                        </div>
                        <div id="newBtn">
                            <div class="query-btn" @click="queryBrand">搜索</div>
                            <div class="addBrand" @click="newBrand">提交新品牌</div>
                        </div>
                    </form>
                </div>
                <template v-if="brandlist.length>0">
                <div class="brand-list" v-if="isPC">
                    <ul class="brand-title">
                        <li>品牌名称</li>
                        <li>品牌logo</li>
                        <li>状态</li>
                        <li>品牌描述</li>
                        <li>提交时间</li>
                        <li>操作</li>
                    </ul>
                    <div class="tbody">
                        <ul v-for="item in brandlist">
                            <li class="brand-name">{{item.name}}</li>
                            <li class="brand-logo">
                                <img :src="item.logo" v-if="item.logo!=''&&item.logo!=null">
                               <img src="/img/order/brand-wu.svg" v-else>
                            </li>
                            <li class="brand-status">
                                <span class="font-red" v-if="item.status ==0">待审核</span>
                                <span class="font-blue" v-if="item.status ==1">审核通过</span>
                                <span class="font-red" v-if="item.status ==2">审核未通过 <br>原因：{{item.auditNote}}</span>
                            </li>
                            <li class="brand-description">
                                <span v-if="item.description ==''|| item.description==null">暂无</span>
                                <span v-else>{{item.description}}</span>

                            </li>
                            <li class="brand-time">{{item.createDate}}</li>
                            <li class="brand-edit">
                                <span v-if="item.status != 1" @click="editBrand(item)">编辑</span>
                                <span v-else>无</span>
                            </li>
                        </ul>
                    </div>
                </div>
                <div class="brand-list" v-else>
                    <div class="list" v-for="item in brandlist">
                        <ul class="brand-title">
                            <li>品牌LOGO：</li>
                            <li>品牌名称：</li>
                            <li>状态：</li>
                        </ul>
                        <div style="overflow: hidden">
                            <div class="brand-logo">
                                <img :src="item.logo" v-if="item.logo!=''&&item.logo!=null">
                                <img src="/img/order/brand-wu.svg" v-else>
<!--                                <span v-else>暂无</span>-->
                            </div>
                            <div class="brand-name">
                                <p>
                                    <span class="proname">{{item.name}}</span>
                                    <span class="font-red" v-if="item.status ==0">待审核</span>
                                    <span class="font-blue" v-if="item.status ==1">审核通过</span>
                                    <span class="font-red" v-if="item.status ==2">审核未通过 <br>原因：{{item.auditNote}}</span>
                                </p>
                                <p class="brand-description">品牌描述：</p>
                                <p>
                                    <span v-if="item.description ==''|| item.description==null">暂无</span>
                                    <span v-else class="text-des">{{item.description}}</span>
                                </p>
                            </div>
                        </div>
                        <div class="button">
                            <div class="brand-time">
                                <p class="brand-description">提交时间：</p>
                                <p>{{item.createDate}}</p>
                            </div>
                            <div class="brand-edit">
                                <span v-if="item.status != 1" @click="editBrand(item)">编辑</span>
                                <span v-else>无</span>
                            </div>
                        </div>
                    </div>
                </div>
                </template>
                <template v-else>
                    <div class="empty">
                        <img src="/img/order/icon-empt.svg">
                        <div class="msg"><p>暂无数据</p></div>
                    </div>
                </template>
                <div v-if="(!isPC) && noMore" class="noMore">---- 没有更多了 ----</div>
                <div class="pageWrap clear" v-if="isPC && pageTotal>1">
                    <a v-if="params.pageNum>1" class="prev" @click="toPagination(params.pageNum*1-1)"
                       href="javascript:void(0);"></a>
                    <template v-for="n in showPageBtn">
                        <a v-if="n" :class="{'on':(n==params.pageNum)}" @click="toPagination(n)"
                           href="javascript:void(0);" v-text="n"></a>
                        <span v-else>···</span>
                    </template>
                    <a v-if="params.pageNum<pageTotal" class="next" @click="toPagination(params.pageNum*1+1)"
                       href="javascript:void(0);"></a>
                    <span>共<b v-text="pageTotal>1?pageTotal:1"></b>页</span>
                    <span>跳至</span>
                    <input v-model="pageInput" @blur="checkNum()"/>
                    <span>页</span>&nbsp;
                    <a class="btn" href="javascript:void(0);" @click="toPagination(pageInput)">点击跳转</a>
                </div>
            </div>
        </div>
        <div class="bg-brand" v-show="bgflag">
            <div class="add-brand-box">
                <div class="modal-header">
                    <span class="shou-address">{{title}}</span>
                    <span class="close-modalForm mIcon icon" @click="closebg"></span>
                </div>
                <div class="brand-content">
                    <div class="brandlogo-name">
                        <span class="label"><em class="required">*</em> 品牌名称：</span>
                        <input type="text" v-model="brandobj.name" placeholder="请输入品牌名称"/>
                    </div>
                    <div class="brand-img">
                        <span class="label">品牌logo：</span>
                        <div class="img-box upimg">
                            <img class="center" :src="brandobj.logo" v-if="logoShow">
                            <i class="icon mIcon add" v-if="iconflag"></i>
                            <input type="file" ref="goodslogo" class="add-pic" id="uploadfile" accept="image/*"
                                   @change="uploadlogo"/>
                        </div>
                        <p class="tishiyu">请上传<span class="font-color">jpg/png</span>格式的图片，大小不超过<span>5M</span></p>
                    </div>
                    <div class="brand-description">
                        <span class="label">品牌描述：</span>
                        <textarea rows="" cols="" class="miaoshu" v-model="brandobj.description"
                                  placeholder="请描述品牌信息，不超过200字" maxlength="200"></textarea>
                    </div>
                </div>
                <div class="box-btn">
                    <div class="btn-submit" @click="submit">提交</div>
                    <div class="btn-cancel" @click="closebg">取消</div>
                </div>
            </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/center.js(v=${version})}"></script>
<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/shop/brand.js(v=${version})}"></script>
</body>
</html>
