<gsb-pcpage>
    <div class="bycquerytm">
        <el-dialog width="30%" :visible.sync="showLargePic">
            <img style="width:100%;height:auto" :src="largePicUrl">
        </el-dialog>
        <div style="height: 100%;">
            <!--首页搜索-->
            <div class="row03" v-if="a">
                <div class="image">
                    <span class="search-text">智能商标检索</span><br>
                    <!--商标最新进度-->
                    <!--左边-->
                    <div class="bycquerytm-nav">
                        <!-- <div class="img-warp"><img class="item-img" src="/imgs/shouye-ui-01.png"/></div>
                    <span>商标最新进度</span>
                    </div> -->
                        <div class="bycquerytm-nav-div" style="border-right:1px solid #90B8D7;">
                            最新受理：<span>{{zuixinshouli}}</span> 申请</div>
                        <div class="bycquerytm-nav-div" style="border-right:1px solid #90B8D7;">
                            最新驳回：<span>2018-09-17</span> 申请</div>
                        <div class="bycquerytm-nav-div" style="border-right:1px solid #90B8D7;">
                            最新初审：<span>{{zuixinchushen}}</span> 申请</div>
                        <div class="bycquerytm-nav-div">最新下证：<span>{{zuixinxiazheng}}</span> 申请</div>
                    </div>
                    <div style="margin-top: 10px;margin-bottom: 65px;">
                        <el-autocomplete v-model="mark" :fetch-suggestions="querySearch"
                            placeholder="请输入商标名称、申请号、申请人等信息" style="color:#DE3883;width:700px;"
                            @keyup.enter.native="indexsearch" @select="handleSelect">
                            <div style="padding:12px 0;width: 20px;height:20px;" slot="suffix">
                                <label for="uploads">
                                    <i class="iconfont"
                                        style="color: #108EE9 ;padding-right: 10px;cursor:pointer;">&#xe630;</i>
                                </label>
                                <input type="file" id="uploads" style="height:0;width:0;"
                                    accept="image/png, image/jpeg, image/gif, image/jpg" @change="uploadImg($event, 1)">
                            </div>
                            <el-button class="leibie-btn"
                                style="border: 1px solid rgba(31,144,230,1);border-left: 0px;color: #1CA4FC;"
                                slot="append" @click="checkClick">全部类别
                                <i class="iconfont cqtm-down">
                                    &#xe664;
                                </i>
                            </el-button>
                            <el-button class="search-btn1" slot="append" @click="indexsearch"
                                style="color: white;border: 1px solid rgba(31,144,230,1);">
                                检索
                            </el-button>
                            <!-- <el-button class="search-btn2" style="color: white" slot="append" @click="intelligentassessClick">智能评估</el-button> -->
                        </el-autocomplete>

                        <el-card v-if="f"
                            style="font-size:13px;height:auto;text-align:left;padding-bottom: 20px;position: absolute;width:700px;">
                            <el-checkbox :indeterminate="isIndeterminate" v-model="checkAll"
                                @change="handleCheckAllChange">
                                全选
                            </el-checkbox>
                            <el-checkbox-group v-model="checkedNcl" @change="handleCheckedNclChange">
                                <ul style="list-style:none; padding:0;margin:0;text-align:left;">
                                    <li v-for="n in ncl" :key="n" style="float:left;width:125px">
                                        <el-checkbox :label="n">{{n}}</el-checkbox>
                                    </li>
                                </ul>
                            </el-checkbox-group>
                        </el-card>
                    </div>
                    <!--商标按钮一排-->
                    <div class="shangbiao-button-warp">
                        <div class="item1" style="cursor: pointer;" @click="trademarknoticeclick">
                            <div><img style="cursor:pointer;" src="imgs/gonggaobig1.png" /></div>
                            <div style="color: #333333;font-size: 16px;">
                                公告查询
                            </div>
                        </div>
                        <!-- <div class="item">
                          <button>批量查询 》</button>
                      </div> -->
                        <!-- <div class="item" v-if="qianru">
                          <button @click="byctmmonitlick">商标监控 》</button>
                      </div> -->
                        <div class="item1" style="cursor: pointer;" @click="bycncldetailclick">
                            <div><img style="cursor:pointer;" src="imgs/nclbig2.png" /></div>
                            <div style="color: #333333;font-size: 16px;">
                                2019尼斯分类表
                            </div>
                        </div>
                        <div class="item1" style="cursor: pointer;" @click="showznfx">
                            <div><img style="cursor:pointer;" src="imgs/piliangbig3.png" /></div>
                            <div style="color: #333333;font-size: 16px;">
                                批量检索
                            </div>
                        </div>

                    </div>
                </div>
            </div>
            <!--相似商标第一行-->
            <!--logo-->
            <div v-if="b">

                <div class="search-input">
                    <div class="bycdirectsearch">
                        <div class="biaoyan-logo" @click="bycindexclick">标眼查</div>
                        <!-- <img class="biaoyan-logo" src="/imgs/tmsearch-logo.png" style="cursor:pointer;margin-top: 45px;" @click="bycindexclick"/> -->

                        <el-tabs v-model="activeName" style="padding-top:40px;" :tab-position="tabPosition2" stretch
                            @tab-click="handleClick">

                            <el-tab-pane label="相同商标" name="second"
                                style="width: 600px;border: 1px solid rgba(16,142,233,1)">
                                <div style="position: relative;float:left">
                                    <el-input class="input-input" v-model="mark" style="width: 400px"
                                        placeholder="请输入商标名称" @keyup.enter.native="jqcxsearchClick">
                                        <div style="padding:12px 0;width: 20px;height:20px;" slot="suffix">
                                            <label for="uploads">
                                                <i class="iconfont"
                                                    style="color: #108EE9 ;padding-right: 10px;cursor:pointer;">&#xe630;</i>
                                            </label>
                                            <input type="file" id="uploads"
                                                style="height:0;width:0;position: absolute;top: 0px;left: -41px;"
                                                accept="image/png, image/jpeg, image/gif, image/jpg"
                                                @change="uploadImg($event, 1)">
                                        </div>
                                    </el-input>
                                </div>
                                <div style="width: 100px;height: 40px;float: left;" @mouseenter="mousecheckClick"
                                    @mouseleave="nonemousecheckClick">
                                    <el-button class="leibie-btn">全部类别
                                        <i class="iconfont cqtm-down">
                                            &#xe664;
                                        </i>
                                    </el-button>
                                </div>
                                <div>
                                    <el-button style="float:left;padding-left:0px;" class="search-btn"
                                        @click="jqcxsearchClick" style="margin-left: 0px !important;">检索
                                    </el-button>
                                </div>
                            </el-tab-pane>
                            <el-tab-pane label="相似商标" name="first"
                                style="width: 600px;border: 1px solid rgba(16,142,233,1)">
                                <div style="position: relative;float:left">
                                    <el-input class="input-input" v-model="mark" style="width: 400px"
                                        placeholder="请输入商标名称" @keyup.enter.native="xssbsearchClick">
                                        <div style="padding:12px 0;width: 20px;height:20px;" slot="suffix">
                                            <label for="uploads">
                                                <i class="iconfont"
                                                    style="color: #108EE9 ;padding-right: 10px;cursor:pointer;">&#xe630;</i>
                                            </label>
                                            <input type="file" id="uploads" style="height:0;width:0;"
                                                accept="image/png, image/jpeg, image/gif, image/jpg"
                                                @change="uploadImg($event, 1)">
                                        </div>
                                    </el-input>
                                </div>
                                <div>
                                    <el-button class="leibie-btn" style="float:left;"
                                        @mouseenter.native="mousecheckClick" @mouseleave.native="nonemousecheckClick">
                                        全部类别
                                        <i class="iconfont cqtm-down">
                                            &#xe664;
                                        </i>
                                    </el-button>
                                </div>
                                <div>
                                    <el-button style="float:left;padding-left:0px;" class="search-btn"
                                        @click="xssbsearchClick" style="margin-left: 0px !important;">检索
                                    </el-button>
                                </div>
                            </el-tab-pane>
                            <el-tab-pane label="申请号" name="third"
                                style="width: 600px;border: 1px solid rgba(16,142,233,1)">
                                <div style="position: relative;float:left">
                                    <el-input class="input-input" v-model="zch" style="width:500px" placeholder="请输入申请号"
                                        @keyup.enter.native="zchsearchClick">
                                        <!-- <el-button class="leibie-btn" slot="append" @click="checkClick">全部类别
                                    <i class="iconfont cqtm-down">
                                        &#xe664;
                                    </i>
                                </el-button> -->
                                        <div style="padding:12px 0;width: 20px;height:20px;" slot="suffix">
                                            <label for="uploads">
                                                <i class="iconfont"
                                                    style="color: #108EE9 ;padding-right: 10px;cursor:pointer;">&#xe630;</i>
                                            </label>
                                            <input type="file" id="uploads" style="height:0;width:0;"
                                                accept="image/png, image/jpeg, image/gif, image/jpg"
                                                @change="uploadImg($event, 1)">
                                        </div>
                                    </el-input>
                                </div>
                                <div>
                                    <el-button style="float:left;padding-left:0px;" class="search-btn"
                                        @click="zchsearchClick" style="margin-left: 0px !important;">检索
                                    </el-button>
                                </div>
                            </el-tab-pane>
                            <el-tab-pane label="申请人" name="fourth"
                                style="width: 600px;border: 1px solid rgba(16,142,233,1)">
                                <div style="position: relative;float:left">
                                    <el-input class="input-input" v-model="mark" style="width:500px"
                                        placeholder="请输入申请人" @keyup.enter.native="zcrsearchClick">
                                        <div style="padding:12px 0;width: 20px;height:20px;" slot="suffix">
                                            <label for="uploads">
                                                <i class="iconfont"
                                                    style="color: #108EE9 ;padding-right: 10px;cursor:pointer;">&#xe630;</i>
                                            </label>
                                            <input type="file" id="uploads" style="height:0;width:0;"
                                                accept="image/png, image/jpeg, image/gif, image/jpg"
                                                @change="uploadImg($event, 1)">
                                        </div>
                                        <!-- <el-button class="leibie-btn" slot="append" @click="checkClick">全部类别
                                    <i class="iconfont cqtm-down">
                                        &#xe664;
                                    </i>
                                </el-button> -->
                                    </el-input>
                                </div>
                                <div>
                                    <el-button style="float:left;padding-left:0px;" class="search-btn" slot="append"
                                        @click="zcrsearchClick" style="margin-left: 0px !important;">检索
                                    </el-button>
                                </div>
                            </el-tab-pane>

                            <el-tab-pane label="图形检索" name="five"
                                style="width: 600px;border: 1px solid rgba(16,142,233,1)">
                                <div style="position: relative;float:left">
                                    <el-input class="input-input" disabled="true" style="width:500px" placeholder="">
                                        <div style="padding:12px 0;width: 20px;height:20px;" slot="suffix">
                                            <label for="uploads">
                                                <i class="iconfont"
                                                    style="color: #108EE9 ;padding-right: 10px;cursor:pointer;">&#xe630;</i>
                                            </label>
                                            <input type="file" id="uploads" style="height:0;width:0;"
                                                accept="image/png, image/jpeg, image/gif, image/jpg"
                                                @change="uploadImg($event, 1)">
                                        </div>
                                        <!-- <i slot="suffix" >
                                    <gsb-cropper style="height:100px;" title="把不必要的部分裁剪掉，以保证搜索结果的准确性" @submitSuccess="submitSuccess" @submitError="submitError">
                                    </gsb-cropper>
                                </i> -->
                                    </el-input>
                                    <div class="img-review">
                                        <el-tag v-if="imageUrl" :key="tag.name" closable="true" @close="closeTag(tag)">
                                            <img class="item-img" name="img" :src="imageUrl" alt="商标" />
                                            <span>{{tag.name}}</span>
                                        </el-tag>
                                    </div>
                                </div>
                                <div>
                                    <el-button style="float:left;padding-left:0px;" class="search-btn" slot="append"
                                        type="default" @click="imagequery()" style="margin-left: 0px !important;">检索
                                    </el-button>
                                </div>
                            </el-tab-pane>
                            <el-tab-pane label="商品/服务项" name="six"
                                style="width: 600px;border: 1px solid rgba(16,142,233,1)">
                                <div style="position: relative;float:left">
                                    <el-input class="input-input" v-model="nclfuwu" style="width:500px"
                                        placeholder="请输入查询项" @keyup.enter.native="nclFuwusearchClick">
                                        <div style="padding:12px 0;width: 20px;height:20px;" slot="suffix">
                                            <label for="uploads">
                                                <i class="iconfont"
                                                    style="color: #108EE9 ;padding-right: 10px;cursor:pointer;">&#xe630;</i>
                                            </label>
                                            <input type="file" id="uploads" style="height:0;width:0;"
                                                accept="image/png, image/jpeg, image/gif, image/jpg"
                                                @change="uploadImg($event, 1)">
                                        </div>
                                        <!-- <el-button class="leibie-btn" slot="append" @click="checkClick">全部类别
                                <i class="iconfont cqtm-down">
                                    &#xe664;
                                </i>
                            </el-button> -->
                                    </el-input>
                                </div>
                                <div>
                                    <el-button style="float:left;padding-left:0px;" class="search-btn" slot="append"
                                        @click="nclFuwusearchClick" style="margin-left: 0px !important;">检索
                                    </el-button>
                                </div>
                            </el-tab-pane>
                        </el-tabs>
                        <div class="search-navArr">
                            <div @click="showznfx">批量检索</div>
                            <div @click="trademarknoticeclick">公告查询</div>
                        </div>
                        <div class="search-bottom"></div>
                        <div v-if="fff" class="selected-list1" style="margin-top: -59px;margin-left: 130px;"
                            @mouseenter="mousecheckClick" @mouseleave="nonemousecheckClick">
                            <el-checkbox :indeterminate="isnumIndeterminate" v-model="checkAllNclNum"
                                @change="handleCheckAllNumChange">
                                全选
                            </el-checkbox>
                            <el-checkbox-group v-model="checkedNclNum" @change="handleCheckedNclNumChange">
                                <ul style="list-style:none; padding:0;margin:0;text-align:left;">
                                    <li v-for="n in nclNum" :key="n" style="float:left;width:55px">
                                        <el-checkbox :label="n">{{n}}</el-checkbox>
                                    </li>
                                </ul>
                            </el-checkbox-group>
                        </div>
                    </div>
                </div>
            </div>
            <div class="search-warp-row01"
                v-if="b && !fuwu && querydata.length > 0 || nclfuwudata.length>0 || queryimagedata.length>0">
                <!-- <div style="clear:both"></div> -->
                <!--已选-->
                <div class="selected-warp" v-if="d">
                    <span>已选条件: </span>
                    <el-tag closable :disable-transitions="false" size="mini" class="item-text"
                        style="margin-left: 20px;font-size:10px;" @close="nametabClose(nametabkey)" v-if="nametabkey">
                        {{nametabkey}}
                    </el-tag>
                    <el-tag closable :disable-transitions="false" size="mini" class="item-text"
                        style="margin-left: 20px;font-size:10px;" @close="sqlbtabClose(sqlbtab)" v-if="sqlbtab">
                        <span @mouseenter="staySelectedDropDownList"
                            @mouseleave="noneSelectedDropDownList">{{sqlbtab}}</span>
                    </el-tag>
                    <!--已选下拉列表-->
                    <div v-if="x" class="selected-list" @mouseenter="staySelectedDropDownList"
                        @mouseleave="noneSelectedDropDownList" style="margin-left:83px;">
                        <el-checkbox :indeterminate="isXIndeterminate" v-model="checkxAll"
                            @change="handleCheckAllChange02">
                            全选
                        </el-checkbox>
                        <el-checkbox-group class="selected-list-scroll" v-model="checkedXcl"
                            @change="handleCheckedXclChange">
                            <ul>
                                <li v-for="x in xcl" :key="x" style="width:125px">
                                    <el-checkbox :label="x">{{x.code}} {{x.name}}</el-checkbox>
                                </li>
                            </ul>
                        </el-checkbox-group>
                        <!--按钮-->
                        <div class="buttom-warp">
                            <div class="item">
                                <button>取消</button>
                            </div>
                            <div class="item" @click="ncltwocodeclick">
                                <button>确认</button>
                            </div>
                        </div>
                    </div>


                    <el-tag closable :disable-transitions="false" size="mini" class="item-text"
                        style="margin-left: 20px;font-size:10px;" @close="flzttabClose(flzttab)" v-if="flzttab">
                        {{flzttab}}
                    </el-tag>
                    <el-tag closable :disable-transitions="false" size="mini" class="item-text"
                        style="margin-left: 20px;font-size:10px;" @close="sqnftabClose(sqnftabkey)" v-if="sqnftabkey">
                        {{sqnftabkey}}
                    </el-tag>
                </div>
                <div style="width:1130px;color:black;margin:auto;margin-top:10px;" v-if="e">
                    <!--申请人-->
                    <gsb-collapse2 class="nianfen-warp" v-if="nametab">
                        <el-row slot="desc">
                            <el-col :span="2" style="padding:3px 0;color: #828282">
                                <span>申请人:</span>
                            </el-col>
                            <div style="float:left;width: 91%;height: 32px;overflow: hidden;">
                                <div class="itemsqr" v-for="o in namedata.slice(0,10)" :key="o">
                                    <el-button type="text" @click="nameclick(o)" size="mini"
                                        :style="stylesetname(o.key)">
                                        {{o.key}}<var>({{o.keycount}})</var>
                                    </el-button>
                                </div>
                            </div>
                        </el-row>
                        <el-row class="row2">
                            <div class="itemsqr" v-for="o in namedata.slice(10,50)" :key="o">
                                <el-button type="text" @click="nameclick(o)" size="mini" :style="stylesetname(o.key)">
                                    {{o.key}}<var>({{o.keycount}})</var>
                                </el-button>
                            </div>
                        </el-row>
                    </gsb-collapse2>
                    <!--申请类别-->
                    <gsb-collapse2 class="shenqing-warp">
                        <el-row slot="desc">
                            <el-col :span="2" style="padding:3px 0;color: #828282">
                                <span>申请类别:</span>
                            </el-col>
                            <el-col class="item" v-for="o in sqlbdata.slice(0,5)" :key="o" :span="3">
                                <el-button type="text" @click="sqlbclick(o)" size="mini" :style="styleset(o.key)">
                                    {{o.keyvalue}}<var>({{o.keycount}})</var>
                                </el-button>
                            </el-col>
                        </el-row>
                        <el-row class="row2">
                            <el-col class="item" v-for="o in sqlbdata.slice(5,45)" :key="o" :span="3">
                                <el-button type="text" @click="sqlbclick(o)" size="mini" :style="styleset(o.key)">
                                    {{o.keyvalue}}<var>({{o.keycount}})</var>
                                </el-button>
                            </el-col>
                        </el-row>
                    </gsb-collapse2>
                    <!--法律状态-->
                    <gsb-collapse3 class="falv-warp">
                        <el-row slot="desc">
                            <el-col :span="2" style="padding:3px 0;color: #828282">
                                <span>法律状态:</span>
                            </el-col>
                            <el-col class="item" v-for="o in flztdata" :key="o" :span="3">
                                <el-button type="text" @click="flztclick(o)" size="mini" :style="stylesetflzt(o.key)">
                                    {{o.keyvalue}}<var>({{o.keycount}})</var>
                                </el-button>
                            </el-col>
                        </el-row>
                    </gsb-collapse3>
                    <!--申请年份-->
                    <gsb-collapse2 class="nianfen-warp">
                        <el-row slot="desc">
                            <el-col :span="2" style="padding:3px 0;color: #828282">
                                <span>申请年份:</span>
                            </el-col>
                            <div style="float:left;width: 90%;height: 32px;overflow: hidden;">
                                <div class="item1" v-for="o in sqnfdata.slice(0,10)" :key="o">
                                    <el-button type="text" @click="sqnfclick(o)" size="mini"
                                        :style="stylesetsqnf(o.key)">
                                        {{o.key}}<var>({{o.keycount}})</var>
                                    </el-button>
                                </div>
                            </div>
                        </el-row>
                        <el-row class="row2">
                            <div class="item1" v-for="o in sqnfdata.slice(10,50)" :key="o">
                                <el-button type="text" @click="sqnfclick(o)" size="mini" :style="stylesetsqnf(o.key)">
                                    {{o.key}}<var>({{o.keycount}})</var>
                                </el-button>
                            </div>
                        </el-row>
                    </gsb-collapse2>
                    <!--筛选条件-->
                    <div style="width:1130px;color:black;height: 30px;margin:auto;" v-if="g">
                        <div style="float:left;margin-top:5px;width:90px;height:25px;text-align: left;">
                            <span style="font-size:13px;color:#828282">高级筛选: </span>
                        </div>
                        <div style="float:left;margin-top:5px;width:80px;height:25px;text-align: left;">
                            <el-checkbox :indeterminate="isIndeterminateSbtj" v-model="checkAllSbtj"
                                @change="handleCheckAllChangeSbtj">
                                全选
                            </el-checkbox>
                        </div>
                        <div style="float:left;width:700px;height:25px;margin-top:5px;text-align: left;">
                            <el-checkbox-group v-model="checkedSbtj" @change="handleCheckedChangeSbtj">
                                <ul style="list-style:none; padding:0;margin:0;text-align:left;">
                                    <li v-for="s in sbtj" :key="s" style="float:left;width:100px;">
                                        <el-checkbox :label="s" size="mini">{{s}}</el-checkbox>
                                    </li>
                                </ul>
                            </el-checkbox-group>
                        </div>
                    </div>
                </div>
                <div class="zhuce-warp" v-if="xssb_no_ncl && xssb_unregistered_Ncl.length>0"
                    :data="xssb_unregistered_Ncl">
                    <div>
                        <span class="item-text">
                            <i class="iconfont">&#xe625;</i>以下类别暂未申请注册，您可以尝试注册哦！
                        </span>
                    </div>
                    <div style="width:1130px;">
                        <gsb-collapse2 class="shenqing-warp">
                            <el-row slot="desc">
                                <el-col class="item2" v-for="o in xssb_unregistered_Ncl.slice(0,7)" :key="o" :span="2">
                                    <el-button size="mini" style="width:120px;" @click="sbzcclick()">
                                        {{o.name}}
                                    </el-button>
                                </el-col>
                            </el-row>
                            <el-row class="row3">
                                <el-col class="item2" v-for="o in xssb_unregistered_Ncl.slice(7,45)" :key="o" :span="2">
                                    <el-button size="mini" style="width:110px;margin-top:3px;" @click="sbzcclick()">
                                        {{o.name}}
                                    </el-button>
                                </el-col>
                            </el-row>
                        </gsb-collapse2>

                        <!-- <ul style="list-style:none; padding:0;margin:0;text-align:left;">
                    <li class="item-li" v-for="o in xssb_unregistered_Ncl" :key="o">
                        <el-button type="text" size="mini" disabled>{{o.name}}</el-button>
                    </li>
                </ul> -->
                        <div style="clear:both;height:0;font-size: 1px;line-height: 0px;"></div>
                    </div>
                    <!-- <div style="width:100%;border-bottom:1px solid #eee;"></div> -->
                </div>
                <div class="zhuce-warp" v-if="jqcx_no_ncl && jqcx_unregistered_Ncl.length>0"
                    :data="jqcx_unregistered_Ncl">
                    <div>
                        <span class="item-text">
                            <i class="iconfont">&#xe625;</i>以下类别暂未申请注册，您可以尝试注册哦！
                        </span>
                    </div>
                    <div style="width:1130px;">
                        <gsb-collapse2 class="shenqing-warp">
                            <el-row slot="desc">
                                <el-col class="item2" v-for="o in jqcx_unregistered_Ncl.slice(0,7)" :key="o" :span="2">
                                    <el-button size="mini" style="width:120px;" @click="sbzcclick()">
                                        {{o.name}}
                                    </el-button>
                                </el-col>
                            </el-row>
                            <el-row class="row3">
                                <el-col class="item2" v-for="o in jqcx_unregistered_Ncl.slice(7,45)" :key="o" :span="2">
                                    <el-button size="mini" style="width:120px;margin-top:3px;" @click="sbzcclick()">
                                        {{o.name}}
                                    </el-button>
                                </el-col>
                            </el-row>
                        </gsb-collapse2>
                        <!-- <ul style="list-style:none; padding:0;margin:0;text-align:left;">
                    <li class="item-li" v-for="o in jqcx_unregistered_Ncl" :key="o">
                        <el-button type="text" size="mini" disabled>{{o.name}}</el-button>
                    </li>
                </ul> -->
                        <div style="clear:both;height:0;font-size: 1px;line-height: 0px;"></div>
                    </div>
                    <!-- <div style="width:100%;border-bottom:1px solid #eee;"></div> -->
                </div>
            </div>
            <!--共查到数据-->
            <div class="total-warp" v-if="h">
                <div>
                    <el-button type="text" size="small" style="color:#828282" disabled>共查到 <span
                            style="color:#108EE9">{{total}}</span>
                        条信息
                    </el-button>
                </div>
                <!--排版切换-->
                <div v-if="c" style="width:25px" @click="changedatashow3"><img style="width:15px;cursor:pointer;"
                        src="imgs/picture3.png" /></div>
                <div v-if="c" style="width:25px" @click="changedatashow1"><img style="width:15px;cursor:pointer;"
                        src="imgs/picture1-1.png" /></div>
                <div v-if="c" style="width:25px" @click="changedatashow2"><img style="width:15px;cursor:pointer;"
                        src="imgs/picture2.png" /></div>
                <div v-if="c2" style="width:25px" @click="changedatashow3"><img style="width:15px;cursor:pointer;"
                        src="imgs/picture3.png" /></div>
                <div v-if="c2" style="width:25px" @click="changedatashow1"><img style="width:15px;cursor:pointer;"
                        src="imgs/picture1.png" /></div>
                <div v-if="c2" style="width:25px" @click="changedatashow2"><img style="width:15px;cursor:pointer;"
                        src="imgs/picture2-2.png" /></div>
                <div v-if="c3" style="width:25px" @click="changedatashow3"><img style="width:15px;cursor:pointer;"
                        src="imgs/picture3-3.png" /></div>
                <div v-if="c3" style="width:25px" @click="changedatashow1"><img style="width:15px;cursor:pointer;"
                        src="imgs/picture1.png" /></div>
                <div v-if="c3" style="width:25px" @click="changedatashow2"><img style="width:15px;cursor:pointer;"
                        src="imgs/picture2.png" /></div>
                <!--导出数据-->
                <span class="daochu-text" @click="showExport">
                    <i class="iconfont cqtm-down">
                        &#xe80b;
                    </i>
                    导出数据
                </span>
                <!-- <div style="float:left;width:600px;height:30px;text-align: right;;overflow: hidden; ">
            <el-button type="text" :disabled="defaultsort" size="small" @click="defaultsortclick">默认排序</el-button>
            <el-button type="text" :disabled="sblxsort" size="small" @click="sblxsortclick" >商标类型</el-button>
            <el-button type="text" :disabled="sqnfsort" size="small" @click="sqnfsortclick">申请年份</el-button>
          </div>
          <div style="float:left;width:200px;height:30px;text-align: center;background-color:#EBEEF5">
              <el-button type="text" size="small" disabled>智能化商标服务</el-button>
          </div> -->
            </div>
            <div class="result-warp3" v-if="c2">
                <div style="padding:10px;">
                    <el-table border :data="querydata" :header-cell-style="tableHeaderColor" :row-style="tableRowStyle"
                        style="height:auto;cursor:pointer;" @row-click="handle1">
                        <el-table-column prop="sbmc" label="商标名称" width="130"></el-table-column>
                        <el-table-column prop="gjflname" label="国际分类" width="140"></el-table-column>
                        <el-table-column prop="sbzch" label="申请号" width="100"></el-table-column>
                        <el-table-column prop="sqrq" label="申请日期" width="160"></el-table-column>
                        <el-table-column prop="sbzt" label="法律状态" width="100"></el-table-column>
                        <el-table-column prop="sbqz" label="商标群组" width="300"></el-table-column>
                        <el-table-column prop="zcr" label="申请人" width="249"></el-table-column>
                    </el-table>
                    <el-footer class="footer-row2" v-if="total>0">

                        <el-pagination background layout=" prev, pager, next, jumper,sizes,total" :currentPage="page"
                            :page-size="size" @current-change="handleCurrentChange" @size-change="handleSizeChange"
                            :page-sizes="[20,50,100,200]" :total="total">
                        </el-pagination>
                    </el-footer>
                </div>
            </div>

            <div class="result-warp3" v-if="c3 && querydata.length > 0">
                <div style="width:300px;float:left;border-radius:4px;overflow: hidden;border: 1px solid #d8d8d8;">
                    <el-table :data="querydata" style="width:100%;cursor:pointer;"
                        :header-cell-style="tableHeaderColor1" @row-click="handle2" row-style="height:20px;"
                        highlight-current-row>
                        <el-table-column prop="sbmc" label="商标名称" width="130"></el-table-column>
                        <el-table-column prop="gjfl" label="分类" width="50"></el-table-column>
                        <el-table-column prop="sqrq" label="申请日期" width="120"></el-table-column>
                    </el-table>
                    <div style="width:100%;height:50px;background-color:white;margin-top:0px;text-align:center">
                        <el-pagination small :page-size="size" :currentPage="page" layout="prev, pager, next"
                            :total="total" @current-change="handleCurrentChange1" style="padding-top:15px">
                        </el-pagination>
                    </div>
                </div>
                <div style="width:864px;float:right">

                    <div class="brand-detail-table">
                        <tbody>
                            <tr>
                                <td class="td-title">商标名称</td>
                                <td class="td-content" colspan="2"
                                    v-if="detaildata.sbmc==null || detaildata.sbmc==\'\'">---</td>
                                <td class="td-content" colspan="2" v-else>{{detaildata.sbmc}}</td>
                                <td rowspan="5" style="text-align: center;cursor: pointer">
                                    <img @click="showLargeTm(detaildata.logo)" v-if="detaildata.logo"
                                        style="width:140px;height:140px;" :src="detaildata.logo">
                                    <img v-else style="width:140px;height:140px;"
                                        src="https://gsb-zc.oss-cn-beijing.aliyuncs.com/zc_imagequery293101543401586324201828183946324czhd.png">
                                </td>
                            </tr>
                            <tr>
                                <td class="td-title">申请号</td>
                                <td class="td-content" colspan="2"
                                    v-if="detaildata.sbzch==null || detaildata.sbzch==\'\'">---</td>
                                <td class="td-content" colspan="2" v-else>{{detaildata.sbzch}}</td>
                            </tr>
                            <tr>
                                <td class="td-title">法律状态</td>
                                <td class="td-content" style="color: #108EE9;" colspan="2"
                                    v-if="detaildata.sbzt==null || detaildata.sbzt==\'\'">
                                    ---
                                </td>
                                <td class="td-content" style="color: #108EE9;" colspan="2" v-else>{{detaildata.sbzt}}
                                </td>
                            </tr>
                            <tr>
                                <td class="td-title">国际分类</td>
                                <td class="td-content" colspan="2"
                                    v-if="detaildata.gjfl==null || detaildata.gjfl==\'\'">---</td>
                                <td class="td-content" colspan="2" v-else>{{detaildata.gjflname}}</td>
                            </tr>
                            <tr>
                                <td class="td-title">申请日期</td>
                                <td class="td-content" colspan="2"
                                    v-if="detaildata.sqrq==null || detaildata.sqrq==\'\'">---</td>
                                <td class="td-content" colspan="2" v-else>{{detaildata.sqrq}}</td>
                            </tr>
                            <tr>
                                <td class="td-title">申请人名称</td>
                                <td class="td-content" style="color: #108EE9;" colspan="3"
                                    v-if="detaildata.zcr==null || detaildata.zcr==\'\'">
                                    ---
                                </td>
                                <td class="td-content" style="color: #108EE9;" colspan="3" v-else>
                                    <span style="cursor: pointer"
                                        @click="mask(detaildata.zcr)">{{detaildata.zcr}}</span>
                                    <i class="iconfont" @click="mask(detaildata.zcr)"
                                        style="cursor: pointer">&#xe67d;</i>
                                </td>
                            </tr>
                            <tr>
                                <td class="td-title">申请人地址</td>
                                <td class="td-content" colspan="3"
                                    v-if="detaildata.zcdz==null || detaildata.zcdz==\'\'">---</td>
                                <td class="td-content" colspan="3" v-else>{{detaildata.zcdz}}</td>
                            </tr>
                            <tr>
                                <td class="td-title">申请人名称（英文）</td>
                                <td class="td-content" colspan="3"
                                    v-if="detaildata.zcren==null || detaildata.zcren==\'\'">---</td>
                                <td class="td-content" colspan="3" v-else>{{detaildata.zcren}}</td>
                            </tr>
                            <tr>
                                <td class="td-title">申请人地址（英文）</td>
                                <td class="td-content" colspan="3"
                                    v-if="detaildata.zcdzen==null || detaildata.zcdzen==\'\'">---</td>
                                <td class="td-content" colspan="3" v-else>{{detaildata.zcdzen}}</td>
                            </tr>
                            <tr>
                                <td class="td-title">
                                    商品/服务项目
                                </td>
                                <td colspan="3">
                                    <!--第二列-->
                                    <table class="innner-table">
                                        <tr class="row01">
                                            <td class="td-title">
                                                已注册群组
                                                <el-button size="mini" @click="copyLink()"
                                                    style="margin-left:12px;border-radius:4px;">
                                                    复制
                                                </el-button>
                                            </td>
                                            <td class="td-title">
                                                未注册群组
                                            </td>
                                        </tr>
                                        <tr class="row02">
                                            <td class="td-title td-row01">

                                                <ul style="list-style:none; padding:0px 15px;margin:0;text-align:left;">
                                                    <li v-for="o in nclexist" :key="o">
                                                        <span>{{o.code}} {{o.small_name}} </span>
                                                    </li>
                                                </ul>

                                            </td>
                                            <td class="td-title">
                                                <ul style="list-style:none; padding:0px 15px;margin:0;text-align:left;">
                                                    <li v-for="o in nclnotexist" :key="o">
                                                        <span>{{o.code}} {{o.name}} </span>
                                                    </li>
                                                </ul>
                                            </td>
                                        </tr>

                                    </table>
                                </td>
                            </tr>

                            <tr>
                                <td class="td-title">初审公告期号</td>
                                <td class="td-content" v-if="detaildata.csggqh==null || detaildata.csggqh==\'\'">---
                                </td>
                                <td class="td-content" v-else>
                                    <span>{{detaildata.csggqh}}</span>
                                    <span @click="noticecsggClick(detaildata)"><i class="el-icon-search"
                                            style="cursor:pointer;color:#108EE9;"></i></span>
                                </td>
                                <td class="td-title">初审公告日期</td>
                                <td class="td-content" v-if="detaildata.csrq==null || detaildata.csrq==\'\'">---</td>
                                <td class="td-content" v-else>{{detaildata.csrq}}</td>
                            </tr>
                            <tr>
                                <td class="td-title">注册公告期号</td>
                                <td class="td-content" v-if="detaildata.zcggqh==null || detaildata.zcggqh==\'\'">---
                                </td>
                                <td class="td-content" v-else>
                                    {{detaildata.zcggqh}}
                                    <span @click="noticezcggClick(detaildata)"><i class="el-icon-search"
                                            style="cursor:pointer;color:#108EE9;"></i></span>
                                </td>
                                <td class="td-title">注册公告日期</td>
                                <td class="td-content" v-if="detaildata.zcrq==null || detaildata.zcrq==\'\'">---</td>
                                <td class="td-content" v-else>{{detaildata.zcrq}}</td>
                            </tr>
                            <tr>
                                <td class="td-title">专用权期限</td>
                                <td class="td-content" v-if="detaildata.zcrq!=\'\' || detaildata.jzrq!=\'\'">
                                    {{detaildata.zcrq}} 至 {{detaildata.jzrq}}
                                </td>
                                <td class="td-content" v-else>---</td>
                                <td class="td-title">代理机构名称</td>
                                <td class="td-content" style="color: #108EE9;"
                                    v-if="detaildata.dljg==null || detaildata.dljg==\'\'">---</td>
                                <td class="td-content" style="color: #108EE9;" v-else>
                                    <span style="cursor: pointer"
                                        @click="mask(detaildata.dljg)">{{detaildata.dljg}}</span>
                                    <i class="iconfont" @click="mask(detaildata.dljg)"
                                        style="cursor: pointer;color: rgb(16, 142, 233)">&#xe67d;</i>
                                </td>
                            </tr>
                            <tr>
                                <td class="td-title">商标公告流程</td>
                                <td class="td-content" colspan="3"
                                    v-if="detaildata.lcxx==null || detaildata.lcxx==\'\'">---</td>
                                <td class="td-content" colspan="3" v-else>
                                    <ul style="list-style:none; padding:0;margin:0;text-align:left;">
                                        <li v-for="o in detaildata.lcxx" :key="o">
                                            <span>{{o.name}} </span>
                                            <i class="iconfont" @click="lcxxdetailClick(o)"
                                                style="cursor: pointer;color: rgb(16, 142, 233)">&#xe67d;</i>
                                        </li>
                                    </ul>
                                </td>
                            </tr>
                        </tbody>
                    </div>
                    <el-dialog :title="rowName" :visible.sync="dialogTableVisible">
                        <img style="width:100%" :src="rowLinkUrl" alt="">
                    </el-dialog>
                    <br />
                    <br />

                    <!--弹出层-->
                    <el-dialog id="mask" :visible.sync="showMask">
                        <div class="list-warp">
                            <div class="list">
                                <!--关闭按钮-->
                                <!-- <div class="close-button" @click="maskclose()">
                        <i class="iconfont">&#xe605;</i>
                    </div> -->
                                <!--左边图片详情-->
                                <div class="left-item">
                                    <img src="/imgs/jdt/GSlogo.png">
                                    <div class="title">
                                        {{companyInfo.name}}
                                    </div>
                                    <div class="detail-warp">
                                        <!--第一行-->
                                        <!--<div class="row">
                                <div class="item-img"><img src="/imgs/tm_e.png"/></div>
                                <div class="item-title" v-if="companyInfo.tel_info==null || companyInfo.tel_info==\'\'">
                                    暂无数据
                                </div>
                                <div class="item-title" v-else>{{companyInfo.tel_info}}</div>
                            </div>-->
                                        <div class="clear-div"></div>
                                        <!--第二行-->
                                        <div class="row">
                                            <div class="item-img"><img src="/imgs/jdt/website.png" /></div>
                                            <div class="item-title"
                                                v-if="companyInfo.tel_info==null || companyInfo.tel_info==\'\'">
                                                -
                                            </div>
                                            <div class="item-title" v-else>{{companyInfo.tel_info}}</div>
                                        </div>

                                        <!--第三行-->
                                        <div class="row">
                                            <div class="item-img"><i class="iconfont">&#xe66b;</i></div>
                                            <div class="item-title"
                                                v-if="companyInfo.businessAddress ==null || companyInfo.businessAddress ==\'\'">
                                                -
                                            </div>
                                            <div class="item-title" v-else>{{companyInfo.businessAddress }}</div>
                                        </div>
                                    </div>
                                </div>
                                <!--宽 860 高 431 右手边表格-->
                                <div class="right-item">
                                    <table cellspacing="0" border="0">
                                        <!--第1行-->
                                        <tr>
                                            <td class="title">统一社会信用代码</td>
                                            <td v-if="companyInfo.creditCode==null || companyInfo.creditCode==\'\'">
                                                -
                                            </td>
                                            <td v-else>{{companyInfo.creditCode}}</td>
                                            <td class="title">组织机构代码</td>
                                            <td>{{companyInfo.organizationCode}}</td>
                                        </tr>
                                        <!--第2行-->
                                        <tr>
                                            <td class="title">注册号</td>
                                            <td v-if="companyInfo.registrID==null || companyInfo.registrID==\'\'">
                                                -
                                            </td>
                                            <td v-else>{{companyInfo.registrID}}</td>
                                            <td class="title">经营状态</td>
                                            <td
                                                v-if="companyInfo.managementState==null || companyInfo.managementState==\'\'">
                                                -
                                            </td>
                                            <td v-else>{{companyInfo.managementState}}</td>
                                        </tr>
                                        <!--第3行-->
                                        <tr>

                                            <td class="title">公司类型</td>
                                            <td v-if="companyInfo.companyType==null || companyInfo.companyType==\'\'">
                                                -
                                            </td>
                                            <td v-else>{{companyInfo.companyType}}</td>
                                            <td class="title">成立日期</td>
                                            <td v-if="companyInfo.foundation==null || companyInfo.foundation==\'\'">
                                                -
                                            </td>
                                            <td v-else>{{companyInfo.foundation}}</td>
                                        </tr>
                                        <!--第4行-->
                                        <tr>
                                            <td class="title">法定代表人</td>
                                            <td
                                                v-if="companyInfo.legalRepresentative==null || companyInfo.legalRepresentative==\'\'">
                                                -
                                            </td>
                                            <td v-else>{{companyInfo.legalRepresentative}}</td>
                                            <td class="title">营业期限</td>
                                            <td
                                                v-if="companyInfo.businessTerm==null || companyInfo.businessTerm == \'null至null\' || companyInfo.businessTerm==\'\'">
                                                -
                                            </td>
                                            <td v-else>{{companyInfo.businessTerm}}</td>
                                        </tr>
                                        <!--第5行-->
                                        <tr>
                                            <td class="title">注册资本</td>
                                            <td
                                                v-if="companyInfo.registeredCapital==null || companyInfo.registeredCapital==\'\'">
                                                -
                                            </td>
                                            <td v-else>{{companyInfo.registeredCapital}}</td>
                                            <td class="title">发照日期</td>
                                            <td v-if="companyInfo.dateIssue==null || companyInfo.dateIssue==\'\'">
                                                -
                                            </td>
                                            <td v-else>{{companyInfo.dateIssue}}</td>
                                        </tr>
                                        <!--第6行-->
                                        <tr>
                                            <td class="title">登记机关</td>
                                            <td
                                                v-if="companyInfo.registerOffice==null || companyInfo.registerOffice==\'\'">
                                                -
                                            </td>
                                            <td colspan="3" v-else>{{companyInfo.registerOffice}}</td>
                                        </tr>
                                        <!--第7行-->
                                        <tr>
                                            <td class="title" rowspan="3">营业范围</td>
                                            <td v-if="companyInfo.scope==null || companyInfo.scope===\'\'" rowspan="3">
                                                -
                                            </td>
                                            <td colspan="3" rowspan="3" v-else>
                                                <p>{{companyInfo.scope}}</p>
                                            </td>
                                        </tr>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </el-dialog>

                </div>
            </div>
            <div class="result-warp-zw" v-if="c3 && querydata.length == 0">
                <img src="/imgs/wushuju.png" alt="">
                <div>很抱歉，没有查询到您要搜索的内容 </br>同时您也可以使用同义关键词或减少筛选范围再进行尝试。</div>
            </div>
            <div class="result-warp" v-if="c" style="margin-bottom:20px">
                <div class="item-left">
                    <el-collapse :data="querydata">
                        <ul
                            style="width:100%;list-style:none; padding:0;margin:0;border:1px solid rgba(225,225,225,1);">
                            <li class="text item" v-for="o in querydata" :key="o">
                                <div style="float:left;width:1200px;height:140px;">
                                    <div class="item-img-warp" style="cursor: pointer;"
                                        @click="trademarkdetailclick(o)">
                                        <img class="item-img" v-if="o.logo" :src="o.logo">
                                        <img class="item-img" v-else
                                            src="https://gsb-zc.oss-cn-beijing.aliyuncs.com/zc_imagequery293101543401586324201828183946324czhd.png">
                                    </div>
                                    <div class="item-text-warp" style="margin-top:28px;margin-left:10px;">
                                        <!--第一行title-->
                                        <div class="title">
                                            <a href="javascript:void(0);" @click="trademarkdetailclick(o)"
                                                target="_blank" v-if="o.sbmc==null||o.sbmc==\'\'">---</a>
                                            <a href="javascript:void(0);" @click="trademarkdetailclick(o)"
                                                target="_blank"
                                                v-else-if="o.sbmc.length>20">{{o.sbmc.substring(0,20)}}...</a>
                                            <a href="javascript:void(0);" @click="trademarkdetailclick(o)"
                                                target="_blank" v-else>{{o.sbmc}}</a>
                                            <!-- <a :href="\'http://192.168.133.143:3000/b#/bycdetailtm?\'+o.sbzch+\'&\'+o.gjfl" target="_blank" style="text-decoration:none;color:#108EE9;">{{o.sbmc.substring(0,40)}}</a> -->
                                        </div>
                                        <!--第一列-->
                                        <div class="columns">
                                            <ul>
                                                <li style="cursor: pointer;" @click="trademarkdetailclick(o)">
                                                    <label>法律状态：</label>
                                                    <span class="spec" v-if="o.sbzt">{{o.sbzt}}</span>
                                                    <span class="spec" v-else>---</span>
                                                </li>
                                                <li>
                                                    <label>申请日期：</label>
                                                    <span v-if="o.sqrq==\'\'">---</span>
                                                    <span v-else>{{o.sqrq}}</span>
                                                </li>
                                                <li>
                                                    <label>申请人：</label>
                                                    <span v-if="o.zcr==\'\'">---</span>
                                                    <span v-else>{{o.zcr}}</span>
                                                </li>
                                            </ul>
                                        </div>
                                        <!--第二列-->
                                        <div class="columns">
                                            <ul>
                                                <li>
                                                    <label>国际分类：</label>
                                                    <span v-if="o.gjfl==null">---</span>
                                                    <span v-else>{{o.gjflname}}</span>
                                                </li>

                                                <li>
                                                    <label>初审公告日期：</label>
                                                    <span v-if="o.csrq==\'\'">---</span>
                                                    <span v-else>{{o.csrq}}</span>
                                                </li>
                                                <li style="width:200%;overflow: hidden">
                                                    <label style="float:left">商标群组：</label>
                                                    <span v-if="o.sbqz==null||o.sbqz==\'\'">---</span>
                                                    <div v-else-if="o.sbqz.length>15"
                                                        style="float: left;width: 70%;overflow: hidden;text-overflow:ellipsis;white-space: nowrap;">
                                                        {{o.sbqz}}
                                                        <!-- <el-tooltip class="item" effect="dark" :content="o.sbqz" placement="right">
                                                    <span>{{o.sbqz.substring(0,15)}}...</span>
                                                  </el-tooltip> -->
                                                    </div>
                                                    <span v-else>{{o.sbqz}}</span>
                                                </li>
                                            </ul>
                                        </div>

                                        <!--第三列-->
                                        <div class="columns">
                                            <ul>
                                                <li>
                                                    <label>申请号：</label>
                                                    <a href="javascript:void(0);" @click="trademarkdetailclick(o)"
                                                        style="text-decoration:none;color:#108EE9;">{{o.sbzch}}</a>
                                                    <!-- <el-button type="text" style="height:4px;text-align:center;" @click="detailclick(o)">{{o.sbzch}}</el-button> -->
                                                </li>
                                                <li>
                                                    <label>注册公告日期：</label>
                                                    <span v-if="o.zcrq==\'\'">---</span>
                                                    <span v-else>{{o.zcrq}}</span>
                                                </li>
                                            </ul>
                                        </div>
                                    </div>
                                </div>
                                <!--下划线-->
                                <div class="line-bottom"></div>
                            </li>

                        </ul>
                        <el-footer class="footer-row" v-if="total>0">
                            <!--下划线-->
                            <div class="line-bottom-02"></div>
                            <el-pagination background layout=" prev, pager, next, jumper,sizes,total"
                                :currentPage="page" :page-size="size" @current-change="handleCurrentChange"
                                @size-change="handleSizeChange" :page-sizes="[20,50,100,200]" :total="total">
                            </el-pagination>
                        </el-footer>
                    </el-collapse>
                </div>
                <!--<div class="item-right">
              <div style="height:30px;text-align: center;background-color:#EBEEF5">
                  <el-button type="text" size="small" disabled>智能化商标服务</el-button>
              </div>
              <div style="height:150px;text-align: center; border-bottom:1px solid #eee;">
                  <span style="font-size:12px;">快速商标注册</span>
                  <div style="width:140px;height:120px;text-align: center;overflow: hidden; ">
                      <img style="width:140px;height:120px;margin:5px"
                           src="https://gsb-zc.oss-cn-beijing.aliyuncs.com//zc_imagequery352111545300309066201820185966jszc.png">
                  </div>
              </div>
              <div style="height:150px;text-align: center;margin-top:5px;border-bottom:1px solid #eee;">
                  <span style="font-size:12px;">快速商标注册</span>
                  <div style="width:140px;height:120px;text-align: center;overflow: hidden; ">
                      <img style="width:140px;height:120px;margin:5px"
                           src="https://gsb-zc.oss-cn-beijing.aliyuncs.com//zc_imagequery352111545300309066201820185966jszc.png">
                  </div>
              </div>
              <div style="height:150px;text-align: center;margin-top:5px;border-bottom:1px solid #eee;">
                  <span style="font-size:12px;">快速商标注册</span>
                  <div style="width:140px;height:120px;text-align: center;overflow: hidden; ">
                      <img style="width:140px;height:120px;margin:5px"
                           src="https://gsb-zc.oss-cn-beijing.aliyuncs.com//zc_imagequery352111545300309066201820185966jszc.png">
                  </div>
              </div>
              <div style="height:150px;text-align: center;margin-top:5px;border-bottom:1px solid #eee;">
                  <span style="font-size:12px;">快速商标注册</span>
                  <div style="width:140px;height:120px;text-align: center;overflow: hidden; ">
                      <img style="width:140px;height:120px;margin:5px"
                           src="https://gsb-zc.oss-cn-beijing.aliyuncs.com//zc_imagequery87111545302066730201820183426730znzc.png">
                  </div>
              </div>
              <div style="height:150px;text-align: center;margin-top:5px;border-bottom:1px solid #eee;">
                  <span style="font-size:12px;">热门商标出售</span>
                  <div style="width:140px;height:120px;text-align: center;overflow: hidden; ">
                      <img style="width:140px;height:120px;margin:5px"
                           src="https://gsb-zc.oss-cn-beijing.aliyuncs.com//zc_imagequery352111545300309066201820185966jszc.png">
                  </div>
              </div>
          </div> -->

            </div>
            <!--检索条数元素-->
            <div v-if="img" class="img-total-warp">
                <gsb-flowlayout1 ref="flowlayout" :datasrc="queryimagedata" xspan="4" @pagechanged="pageChanged">
                    <span class="item-text" slot="header">共查到<var>{{imagecount}}</var>条数据</span>

                    <div class="item-result" slot="content" slot-scope="scope" @click="trademarkdetailclick(scope.item)"
                        @mouseenter="resultEnter(scope.item.sbzch)" @mouseleave="resultlEave()">
                        <!-- <el-tooltip class="item" effect="dark" content="点击查看详情" placement="top"> -->
                        <div class="item-result-img">
                            <div style="width:120px;height:120px;margin:auto;">
                                <img v-if="scope.item.logo" style="width:120px;height:120px;border:0px solid #eee;"
                                    :src="scope.item.logo" />
                                <img v-else style="width:120px;height:120px;border:0px solid #eee;"
                                    src="https://gsb-zc.oss-cn-beijing.aliyuncs.com/zc_imagequery293101543401586324201828183946324czhd.png" />
                            </div>
                            <div class="item-result-zzc" v-if="resultVal == scope.item.sbzch">
                                <div slot="reference" style="font-size:12px;text-align:center;">商标号:{{scope.item.sbzch}}
                                </div>
                                <div slot="reference" style="font-size:12px;text-align:center;">
                                    国际分类:{{scope.item.gjflname}}</div>
                                <div slot="reference" style="font-size:12px;text-align:center;">商标状态:{{scope.item.sbzt}}
                                </div>
                            </div>
                        </div>
                        <div slot="reference"
                            style="font-size:12px;text-align:center;font-size:14px;font-family:PingFangSC-Regular;font-weight:400;color:rgba(74,74,74,1);">
                            法律状态：<span style="color:#108EE9">{{scope.item.sbzt}}</span></div>
                        <!-- </el-tooltip> -->
                    </div>
                </gsb-flowlayout1>

                <!--对比图片元素-->
                <img v-if="imageupurl" title="图像对比"
                    style="width:120px;height:120px;border:1px solid #909399;position:fixed;right:20px;top:220px"
                    :src="imageupurl" />
                <!-- <div class="img-compare-warp" v-if="imageupurl">
              <img class="item-img"  title="图像对比" :src="imageupurl"/>
              <div>
                  <span>对比图片</span>
              </div>
          </div> -->

            </div>

            <div class="total-warp" v-if="fuwu && nclfuwudata.length>0">
                <div>
                    <el-button type="text" size="small" style="color:#828282" disabled>共查到 <span
                            style="color:#108EE9">{{total}}</span>
                        条信息
                    </el-button>
                </div>
            </div>
            <div class="result-warp" v-if="fuwu && nclfuwudata.length > 0">
                <el-table :data="nclfuwudata" style="width:100%" row-style="height:50px">
                    <el-table-column prop="nclthreename" label="规范商品/服务项目" width="300"></el-table-column>
                    <el-table-column prop="nclonename" label="国际分类" width="200"></el-table-column>
                    <el-table-column prop="ncltwocode" label="所在群组" width="200"></el-table-column>
                    <el-table-column prop="nclthreecode" label="编码" width="200"></el-table-column>
                    <el-table-column label="商品类型" width="300">
                        <template slot-scope="scope">
                            <span v-if="scope.row.nclthreecode">尼斯商品服务项</span>
                            <span v-else>非规范商品服务项</span>
                        </template>
                    </el-table-column>
                </el-table>
                <el-footer class="footer-row" v-if="total>0">
                    <el-pagination background layout=" prev, pager, next, jumper,sizes,total" :currentPage="page"
                        :page-size="size" @current-change="handleCurrentChange" @size-change="handleSizeChange"
                        :page-sizes="[20,50,100,200]" :total="total">
                    </el-pagination>
                </el-footer>
            </div>
            <div class="result-warp-zw" v-if="fuwu && nclfuwudata.length == 0">
                <img src="/imgs/wushuju.png" alt="">
                <div>很抱歉，没有查询到您要搜索的内容 </br>同时您也可以使用同义关键词或减少筛选范围再进行尝试。</div>
            </div>
            <el-dialog title="导出列选择" :visible.sync="exportColumnDialog" center width="550px">
                <el-checkbox-group v-model="exportColumns" style="width: 500px;height: 120px">
                    <ul style="list-style:none; padding:0;margin:0;text-align:left;">
                        <li v-for="n in allColumns" :key="n.name" style="float:left;width:125px;">
                            <el-checkbox :label="n.name" :disabled="n.isDisabled">{{n.name}}</el-checkbox>
                        </li>
                    </ul>
                </el-checkbox-group>

                <div style="width:100%;text-align:center;font-family:Microsoft YaHei">
                    <el-button :loading="downloading" type="primary" @click="exportFile">确定</el-button>
                    <el-button @click="exportColumnDialog=false">取消</el-button>
                </div>

            </el-dialog>
            <div v-if="aitmrate">
                <el-row>
                    <el-col :span="6" v-for="(item,index) in ainclonerate">
                        <gsb-bar :data="item">
                        </gsb-bar>
                        <span>第{{index+1}}大类</span>
                    </el-col>
                </el-row>
            </div>

            <div v-if="showZnfx">
                <div
                    style="width: 100%;position: fixed;top: 0;bottom:0;left: 0;background: #000;z-index: 1000;opacity: 0.7;">
                </div>
                <div
                    style="width: 50%;left:25%;right:25%;height:420px;position: fixed;top:100px;z-index: 1999;background-color:white;text-align: center">
                    <div style="width:96%;margin:10px 2% 0 2%;text-align:right;font-size:18px;"><i @click="hideZnfx"
                            class="el-icon-close" style="cursor:pointer;"></i></div>
                    <div style="width:90%;margin:0 5%;border-bottom: 1px solid #e1e1e1">
                        <h5>上传excel文件完成智能分析</h5>
                    </div>
                    <div style="width:96%;margin:20px 2%;">
                        <div style="width:80%;margin:0 10%;">
                            <img width="150px" height="150px" style="border:2px dashed #e9e9e9"
                                @click="window.open(znfxUrl)" v-if="znfxUrl"
                                src="http://gsb-zc.oss-cn-beijing.aliyuncs.com/zqq_201903191636319163514excel.png" />
                            <img width="150px" height="150px" style="border:2px dashed #e9e9e9" v-else
                                src="http://gsb-zc.oss-cn-beijing.aliyuncs.com/zqq_201903191636163453wenhao.png" />
                            <br />
                            <div style="margin-top:20px;">
                                <gsb-upload style="float:left;width:49%;text-align: right;margin-right:1%;"
                                    flag="znfxUrl" :d="imagedata" :action="action" :ifshowlist="false"
                                    @uploadsuccess="znfxUploadsuccess" @error="znfxError">
                                    <el-button style="color:white" type="primary">excel文件上传</el-button>
                                </gsb-upload>
                                <div style="float:left;width:49%;text-align: left;margin-left:1%;">
                                    <el-button style="color:white" v-if="!znfxUrl" disabled type="primary">智能分析
                                    </el-button>
                                    <el-button style="color:white" v-else type="primary" @click="znfx">智能分析</el-button>
                                </div>
                                <div style="clear:both"></div>
                            </div>

                            <div style="margin-top:10px">
                                <span
                                    @click="window.open(\'http://gsb-zc.oss-cn-beijing.aliyuncs.com/zqq_201903191338dcunvwio34tmznfxmb.xlsx\')"
                                    style="color:red;cursor:pointer;margin-right:2px;">下载模板</span>
                                <span v-if="znfxResultUrl" @click="window.open(znfxResultUrl)"
                                    style="color:#2692FF;cursor:pointer;margin-left:2px;">下载分析结果</span>
                            </div>
                        </div>
                    </div>


                </div>
            </div>
            <!-- 相机弹出层  -->
            <div v-if="show">
                <div
                    style="position: fixed;width:100%;z-index:999;background-color:black;top:0;left:0;right:0;bottom: 0;opacity: 0.5;">
                </div>
                <div style="position:fixed;top:15%;height:60%;left:35%;right:35%;z-index: 9999;background-color:white;">
                    <div class="cut" style="width:100%;text-align:center;margin: 0 auto;">
                        <div style="width:96%;margin:0 2%;text-align:right;font-size:18px;">
                            <i @click="hideCropper" class="el-icon-circle-close" style="cursor:pointer;">
                            </i></div>
                        <h3 style="font-size: .8rem;" v-if="!title">把不必要的部分裁剪掉，以保证搜索结果的准确性</h3>
                        <h3 v-if="title">{{title}}</h3>
                        <vue-cropper ref="cropper" :img="option.img" :output-size="option.size"
                            :output-type="option.outputType" :info="true" :full="option.full" :can-move="option.canMove"
                            :can-move-box="option.canMoveBox" :fixed-box="option.fixedBox" :original="option.original"
                            :auto-crop="option.autoCrop" :auto-crop-width="option.autoCropWidth"
                            :auto-crop-height="option.autoCropHeight" :center-box="option.centerBox"
                            @real-time="realTime" :high="option.high" @img-load="imgLoad"></vue-cropper>
                        <slot></slot>
                        <div>
                            <label class="btn" for="uploads">重新选择</label>
                            <input type="file" id="uploads" style="position:absolute; clip:rect(0 0 0 0);"
                                accept="image/png, image/jpeg, image/gif, image/jpg" @change="uploadImg($event, 1)">
                            <a @click="down(1)" class="btn">下载图片</a>
                            <a class="btn" @click="submit">提交图片</a>
                        </div>
                        <div style="margin-top:15px;">
                            <el-checkbox-group  v-model="checkImage" @change="checkImageValue">
                                <el-checkbox label="原始图像"></el-checkbox>
                                <el-checkbox label="灰度图像"></el-checkbox>
                            </el-checkbox-group>
                        </div>
                    </div>
                </div> 
            </div>
        </div>
        <div id="wave-container" class="animate-wave-container" style="width: 1920px;">
            <div>
                <div class="wave-svg-s1">
                    <svg id="wave-svg" width="1920" height="178px" viewBox="0 0 1920 178"
                        preserveAspectRatio="xMinYMax" version="1.1" xmlns="http://www.w3.org/2000/svg"
                        xmlns:xlink="http://www.w3.org/1999/xlink">
                        <defs>
                            <linearGradient id="wave-gradient1" x1="0%" y1="0%" x2="100%" y2="0">
                                <stop offset="0%" style="stop-color:rgba(28,164,252, 0.5);stop-opacity:1">
                                </stop>
                                <stop offset="50%" style="stop-color:rgba(28,164,252,1);stop-opacity:1"></stop>
                                <stop offset="100%" style="stop-color:rgba(28,164,252,0.5);stop-opacity:1">
                                </stop>
                            </linearGradient>
                        </defs>
                        <g id="s1-copy" transform="translate(0.000000, -22.000000)">
                            <g id="线条组合" transform="translate(0.000000, 22.000000)">
                                <path class="wave-path1" d="
                    M1920,0.047
                    C1707.9649659722222,0.047 1643.2576798611112,62.965 1448.2226458333332,62.965
                    C1253.1876118055557,62.965 1141.718065277778,24 946.6817097222223,24
                    C751.6466756944444,24 661.0506604166667,62.965 466.01562638888896,62.965
                    C270.9792708333334,62.965 195.03503402777778,0 0,0
                    L0,175.047
                    L1920,175.047
                    C1920,175.047 1920.1004361111113,0.047 1920,0.047" id="S3" opacity="0.100000001"></path>
                            </g>
                        </g>
                    </svg>
                </div>
                <div class="wave-link-s1">
                    <div class="wave-keywords-link animated fadeIn" style="top:55px;left:436.1041666666667px"
                        @click="indexsearch(\'孩馋哭\')">
                        <span class="wave-circle-icon animated fadeIn">
                            <span class="wave-circle-icon-big"></span>
                            <span class="wave-circle-icon-small"></span>
                        </span>
                        <span class="wave-keywords-text animated fadeIn">孩馋哭</span>
                    </div>
                    <div class="wave-keywords-link animated fadeIn" style="top:55px;left:1427.25px"
                        @click="indexsearch(\'一锭盈\')">
                        <span class="wave-circle-icon animated fadeIn">
                            <span class="wave-circle-icon-big"></span>
                            <span class="wave-circle-icon-small"></span>
                        </span>
                        <span class="wave-keywords-text animated fadeIn">一锭盈</span>
                    </div>
                </div>
                <div class="wave-svg-s2">
                    <svg id="wave-svg" width="1920" height="178px" viewBox="0 0 1920 178"
                        preserveAspectRatio="xMinYMax" version="1.1" xmlns="http://www.w3.org/2000/svg"
                        xmlns:xlink="http://www.w3.org/1999/xlink">

                        <g id="s1-copy" transform="translate(0.000000, -22.000000)">
                            <g id="线条组合" transform="translate(0.000000, 22.000000)">
                                <path class="wave-path1" d="
                    M1920,175
                    L0,175
                    L0,85
                    C158.58333333333334,85 272.93956434861116,50.0224241 431.5228976819444,50.0224241
                    C590.1062310152778,50.0224241 811.3264802881945,118.825457 969.9098136215279,118.825457
                    C1128.4931469548612,118.825457 1303.5866638055556,50.0224241 1462.1699971388891,50.0224241
                    C1620.7533304722224,50.0224241 1744.4166666666667,83 1920,85
                    L1920,175 Z" id="S2" opacity="0.200000003"></path>
                            </g>
                        </g>
                    </svg>
                </div>
                <div class="wave-link-s2">
                    <div class="wave-keywords-link animated fadeIn" style="top:110px;left:925.0694444444445px"
                        @click="indexsearch(\'清仕\')">
                        <span class="wave-circle-icon animated fadeIn">
                            <span class="wave-circle-icon-big"></span>
                            <span class="wave-circle-icon-small"></span>
                        </span>
                        <span class="wave-keywords-text animated fadeIn">清仕</span>
                    </div>
                </div>
                <div class="wave-svg-s3">
                    <svg id="wave-svg" width="1920" height="178px" viewBox="0 0 1920 178"
                        preserveAspectRatio="xMinYMax" version="1.1" xmlns="http://www.w3.org/2000/svg"
                        xmlns:xlink="http://www.w3.org/1999/xlink">
                        <g id="s1-copy" transform="translate(0.000000, -22.000000)">
                            <g id="线条组合" transform="translate(0.000000, 22.000000)">
                                <path class="wave-path1" d="
                    M1920,175.132909
                    L0,175.132909
                    L0,112.132909
                    C158.58333333333334,112.132909 238.7215561576389,145.132909 397.30488949097224,145.132909
                    C555.8882228243056,145.132909 768.4249060125001,99 927.0082393458334,99
                    C1085.5915726791668,99 1310.6518499708334,139.47418 1469.2351885902779,139.47418
                    C1627.8185219236111,139.47418 1744.4166666666667,113.132909 1920,112.132909
                    L1920,175.132909 Z" id="S1" opacity="0.300000012"></path>
                            </g>
                        </g>
                    </svg>
                </div>
                <div class="wave-link-s3">
                    <div class="wave-keywords-link animated fadeIn" style="top:138px;left:363.4201388888889px"
                        @click="indexsearch(\'疆君\')">
                        <span class="wave-circle-icon animated fadeIn">
                            <span class="wave-circle-icon-big"></span>
                            <span class="wave-circle-icon-small"></span>
                        </span>
                        <span class="wave-keywords-text animated fadeIn">疆君</span>
                    </div>
                    <div class="wave-keywords-link animated fadeIn" style="top:132px;left:1453.6805555555557px"
                        @click="indexsearch(\'闺中酿\')">
                        <span class="wave-circle-icon animated fadeIn">
                            <span class="wave-circle-icon-big"></span>
                            <span class="wave-circle-icon-small"></span>
                        </span>
                        <span class="wave-keywords-text animated fadeIn">闺中酿</span>
                    </div>
                </div>
                <div class="wave-svg-s4">
                    <svg id="wave-svg" width="1920" height="178px" viewBox="0 0 1920 178"
                        preserveAspectRatio="xMinYMax" version="1.1" xmlns="http://www.w3.org/2000/svg"
                        xmlns:xlink="http://www.w3.org/1999/xlink">
                        <g id="s1-copy" transform="translate(0.000000, -22.000000)">
                            <g id="线条组合" transform="translate(0.000000, 22.000000)">
                                <path class="wave-path1" d="
                    M1920,0.047
                    C1707.9649659722222,0.047 1643.2576798611112,62.965 1448.2226458333332,62.965
                    C1253.1876118055557,62.965 1141.718065277778,24 946.6817097222223,24
                    C751.6466756944444,24 661.0506604166667,62.965 466.01562638888896,62.965
                    C270.9792708333334,62.965 195.03503402777778,0 0,0
                    L0,175.047
                    L1920,175.047
                    C1920,175.047 1920.1004361111113,0.047 1920,0.047" id="S3" opacity="0.100000001"></path>
                            </g>
                        </g>
                    </svg>
                </div>
                <div class="wave-link-s4">
                    <div class="wave-keywords-link animated fadeIn" style="top:55px;left:436.1041666666667px"
                        @click="indexsearch(\'肘吧\')">
                        <span class="wave-circle-icon animated fadeIn">
                            <span class="wave-circle-icon-big"></span>
                            <span class="wave-circle-icon-small"></span>
                        </span>
                        <span class="wave-keywords-text animated fadeIn">肘吧</span>
                    </div>
                    <div class="wave-keywords-link animated fadeIn" style="top:55px;left:1427.25px"
                        @click="indexsearch(\'胃语\')">
                        <span class="wave-circle-icon animated fadeIn">
                            <span class="wave-circle-icon-big"></span>
                            <span class="wave-circle-icon-small"></span>
                        </span>
                        <span class="wave-keywords-text animated fadeIn">胃语</span>
                    </div>
                </div>
                <div class="wave-svg-s5">
                    <svg id="wave-svg" width="1920" height="178px" viewBox="0 0 1920 178"
                        preserveAspectRatio="xMinYMax" version="1.1" xmlns="http://www.w3.org/2000/svg"
                        xmlns:xlink="http://www.w3.org/1999/xlink">
                        <g id="s1-copy" transform="translate(0.000000, -22.000000)">
                            <g id="线条组合" transform="translate(0.000000, 22.000000)">
                                <path class="wave-path1" d="
                    M1920,175
                    L0,175
                    L0,85
                    C158.58333333333334,85 272.93956434861116,50.0224241 431.5228976819444,50.0224241
                    C590.1062310152778,50.0224241 811.3264802881945,118.825457 969.9098136215279,118.825457
                    C1128.4931469548612,118.825457 1303.5866638055556,50.0224241 1462.1699971388891,50.0224241
                    C1620.7533304722224,50.0224241 1744.4166666666667,83 1920,85
                    L1920,175 Z" id="S2" opacity="0.200000003"></path>
                            </g>
                        </g>
                    </svg>
                </div>
                <div class="wave-link-s5">
                    <div class="wave-keywords-link animated fadeIn" style="top:110px;left:925.0694444444445px"
                        @click="indexsearch(\'一面而就\')">
                        <span class="wave-circle-icon animated fadeIn">
                            <span class="wave-circle-icon-big"></span>
                            <span class="wave-circle-icon-small"></span>
                        </span>
                        <span class="wave-keywords-text animated fadeIn">一面而就</span>
                    </div>
                </div>
                <div class="wave-svg-s6">
                    <svg id="wave-svg" width="1920" height="178px" viewBox="0 0 1920 178"
                        preserveAspectRatio="xMinYMax" version="1.1" xmlns="http://www.w3.org/2000/svg"
                        xmlns:xlink="http://www.w3.org/1999/xlink">
                        <g id="s1-copy" transform="translate(0.000000, -22.000000)">
                            <g id="线条组合" transform="translate(0.000000, 22.000000)">
                                <path class="wave-path1" d="
                    M1920,175.132909
                    L0,175.132909
                    L0,112.132909
                    C158.58333333333334,112.132909 238.7215561576389,145.132909 397.30488949097224,145.132909
                    C555.8882228243056,145.132909 768.4249060125001,99 927.0082393458334,99
                    C1085.5915726791668,99 1310.6518499708334,139.47418 1469.2351885902779,139.47418
                    C1627.8185219236111,139.47418 1744.4166666666667,113.132909 1920,112.132909
                    L1920,175.132909 Z" id="S1" opacity="0.300000012"></path>
                            </g>
                        </g>
                    </svg>
                </div>
                <div class="wave-link-s6">
                    <div class="wave-keywords-link animated fadeIn" style="top:138px;left:363.4201388888889px"
                        @click="indexsearch(\'阿里巴巴\')">
                        <span class="wave-circle-icon animated fadeIn">
                            <span class="wave-circle-icon-big"></span>
                            <span class="wave-circle-icon-small"></span>
                        </span>
                        <span class="wave-keywords-text animated fadeIn">阿里巴巴</span>
                    </div>
                    <div class="wave-keywords-link animated fadeIn" style="top:132px;left:1453.6805555555557px"
                        @click="indexsearch(\'冲鸭\')">
                        <span class="wave-circle-icon animated fadeIn">
                            <span class="wave-circle-icon-big"></span>
                            <span class="wave-circle-icon-small"></span>
                        </span>
                        <span class="wave-keywords-text animated fadeIn">冲鸭</span>
                    </div>
                </div>
            </div>
        </div>  
    </div>    
</gsb-pcpage>