<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="https://www.thymeleaf.org" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
      xsi:schemaLocation="https://www.thymeleaf.org ">
<head>
    <title>采美365网-项目仪器列表</title>
    <template th:replace="components/head-link"></template>
    <link th:href="@{/css/equipment/list.css(v=${version})}" rel="stylesheet" type="text/css">
</head>
<body>
<!-- 引用头部 -->
<template th:replace="components/header"></template>

<!-- 项目仪器搜索列表 -->
<div id="equipmentList">
    <!--loading-->
    <div v-if="listLoading" class="loading">
        <img src="/img/base/loading.gif">
    </div>
    <!--数据为空-->
    <div v-else-if="!listLoading && (!listData || listData.length==0)" class="empty">
        <img src="/img/common/empty.png">
        <div class="msg">
            <p>暂未找到你搜索的项目仪器，快去<a href="/equipment/list.html">项目仪器列表</a>看看吧~</p>
        </div>
    </div>
    <!--列表-->
    <div v-else class="equipmentList">
        <ul class="clear mfw">
            <li class="equipmentItem" v-for="ins in listData">
                <a :href="'/equipment/detail.html?id='+ins.id" target="_blank">
                    <img :src="ins.image">
                    <span class="name" v-html="ins.name"></span>
                </a>
            </li>
        </ul>
    </div>
    <!--分页-->
    <div v-if="(!isPC) && noMore" class="noMore">---- 没有更多了 ----</div>
    <div v-if="isPC && pageTotal>1" class="pageWrap clear">
        <a v-if="params.num>1" class="prev" @click="toPagination(params.num*1-1)" href="javascript:void(0);"></a>
        <template v-for="n in showPageBtn">
            <a v-if="n" :class="{'on':(n==params.num)}" @click="toPagination(n)" href="javascript:void(0);" v-text="n"></a>
            <span v-else>···</span>
        </template>
        <a v-if="params.num<pageTotal" class="next" @click="toPagination(params.num*1+1)" href="javascript:void(0);"></a>
        <span>共<b v-text="pageTotal>1?pageTotal:1"></b>页</span>
        <span>跳至</span>
        <input v-model="pageInput" @blur="checkNum()"/>
        <span>页</span>&nbsp;
        <a class="btn" href="javascript:void(0);" @click="toPagination(pageInput)">点击跳转</a>
    </div>
</div>
<!-- 引入底部 -->
<template th:replace="components/footer"></template>
<template th:replace="components/foot-link"></template>
<script charset="utf-8" type="text/javascript" th:src="@{/js/equipment/list.js(v=${version})}"></script>
</body>
</html>
