<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org"
      xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity4">
<head>
    <meta charset="UTF-8">
    <title>积分-商城</title>
    <meta name="viewport" content="width=device-width,initial-scale=1.0, maximum-scale=1.0, minimum-scale=0.5, user-scalable=no">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
    <meta http-equiv="Pragma" content="no-cache" />
    <meta http-equiv="Expires" content="0" />
    <meta name="sharetitle" content="全科界" />
    <meta name="sharedesc" content="赋能全科医生，培养百姓良医" />
    <meta name="sharepic" content="https://qkj-web.oss-cn-beijing.aliyuncs.com/html5/share.png" />
    <meta name="shareurl" content="" />
    <script src="/static/js/jquery-3.5.1.min.js?v="+Math.random()></script>
    <script type="text/javascript" src="/static/js/h5/common.js"></script>
    <script src="/static/js/common.js?v="+Math.random()></script>
    <script>
        document.write('<link href="/static/css/html5/user/points-mall.css?v=' + Math.random() + '" rel="stylesheet" type="text/css"/>');
    </script>
    <link href="/static/css/html5/common.css?v=" +Math.random() rel="stylesheet" type="text/css"/>

    <script>
var _hmt = _hmt || [];
(function() {
  var hm = document.createElement("script");
  hm.src = "https://hm.baidu.com/hm.js?0305f34866fc4fe377f1bec6dc84d92f";
  var s = document.getElementsByTagName("script")[0];
  s.parentNode.insertBefore(hm, s);
})();
</script>
</head>
<body>
<div class="container">
    <div  th:include="html5/common::common-loading"></div>
    <div  th:include="html5/common::common-firstlogin"></div>
    <div th:include="html5/common::common-integral"></div>
    <!--    <div  th:include="html5/common::common-header"></div>-->
    <input type="hidden" id="memToken" th:value="${memToken}">
    <div @click="gotoBuyRecord()" class="logo">
        <img src="http://files.qkyxzx.com/html5/jfsc-logo.png?v=1" alt="">
        <div class="myjf">{{totalPoints}}</div>
    </div>
    <div class="jfdj-item">
        <img onload="AutoResizeImage(700,166,this)" src="http://files.qkyxzx.com/html5/jfdj.png">
    </div>
    <div class="tab">
        <div v-for="(item,i) in cata" @click="chooseTab(i)" :class="{active: item.active == 1}" class="tab-item">{{item.name}}</div>
    </div>

    <div v-if="cata[0].active == 1" id="list" class="list">
        <div v-if="goodMall.length == 0" class="no-data" style="text-align: center;margin-top: 50px;">
            <img onload="AutoResizeImage(280,200,this)" src="/web/img/null.png"/>
        </div>
        <div v-if="item.type == '商品'" v-for="(item,i) in goodMall" @click="gotoCommodityDetail(item.id)" class="item">
            <div class="top">
                <img onload="AutoResizeImage(327,164,this)" :src="item.img">
            </div>
            <div class="bottom">
                <div class="title">{{item.name}}</div>
                <div class="jf">{{item.points}}<span>积分</span></div>
                <button>立即兑换</button>
            </div>
        </div>
        <div v-if="item.type == '课程'" v-for="(item,i) in goodMall" @click="gotoCourseDetail(item.id)" class="item">
            <div class="top">
                <img onload="AutoResizeImage(327,164,this)" :src="item.img">
            </div>
            <div class="bottom">
                <div class="title">{{item.name}}</div>
                <div class="jf">{{item.points}}<span>积分</span></div>
                <button>立即兑换</button>
            </div>
        </div>
    </div>
    <div v-if="cata[1].active == 1" class="definite">
        <div v-for="(item,i) in userTaskInfo" class="definite-item">
            <div class="definite-title">{{item.taskDesc}}</div>
            <div class="definite-time">{{item.completeTime}}</div>
            <div class="add" v-if="item.changeType == 1">+{{item.points}}</div>
            <div class="subtraction" v-if="item.changeType == 0">-{{item.points}}</div>
        </div>
    </div>
    <div v-if="cata[2].active == 1" class="duties">
       <table class="duties-table">
           <thead>
                <tr>
                    <td>序号</td>
                    <td>操作行为</td>
                    <td>分值</td>
                </tr>
           </thead>
           <tbody>
                <tr v-for="(item,i) in userTaskList">
                    <td>{{i+1}}</td>
                    <td>{{item.taskName}}</td>
                    <td>{{item.taskPoints}}积分</td>
                </tr>
           </tbody>
       </table>
    </div>
    <div v-if="cata[3].active == 1" class="ranking">
        <div v-for="(item,i) in ranking"  class="ranking-item float">
            <div v-if="i == 0" class="num one"><img style="vertical-align:middle" onload="AutoResizeImage(40,40,this)" src="http://files.qkyxzx.com/html5/one.png"></div>
            <div v-if="i == 1" class="num two"><img style="vertical-align:middle" onload="AutoResizeImage(40,40,this)" src="http://files.qkyxzx.com/html5/two.png"></div>
            <div v-if="i == 2" class="num three"><img style="vertical-align:middle" onload="AutoResizeImage(40,40,this)" src="http://files.qkyxzx.com/html5/three.png"></div>
            <div v-if="i > 2" class="num">{{i+1}}</div>
            <div class="header-img">
                <img :src="item.userHeader" alt="">
            </div>
            <div class="user-name">{{item.userName}}</div>
            <div v-if="i == 0" class="mark mark-one">{{item.memResidualPoints}}</div>
            <div v-if="i == 1" class="mark mark-two">{{item.memResidualPoints}}</div>
            <div v-if="i == 2" class="mark mark-three">{{item.memResidualPoints}}</div>
            <div v-if="i > 2" class="mark">{{item.memResidualPoints}}</div>
        </div>
        <div v-if="item.memCard == memToken" v-for="(item,i) in ranking" class="ranking-item fixed float">
            <div class="header-img">
                <img :src="item.userHeader" alt="">
            </div>
            <div class="user-info-item">
                <div class="user-name">{{item.userName}}</div>
                <div class="ranking-info">当前排名第{{i+1}}名</div>
            </div>
            <div class="mark">{{item.memResidualPoints}}</div>
        </div>
    </div>
    <!--    <p id="bottomInfo">全科在线提供技术支持</p>-->
</div>
<footer>
    <div th:include="html5/common::common-footer"></div>
</footer>
</body>
<script type="text/javascript" src="/static/js/jquery.cookie.js"></script>
<script src="/static/js/ucenter.js?v="+Math.random()></script>
<script src="/static/js/vue.js"></script>
<script th:inline="javascript">
    //<![CDATA[
    var fromlogin = [[${fromlogin}]];
    //]]>
</script>
<script>
    document.write('<script src="/static/js/h5/user/points-mall.js?v=' + Math.random() + '"><\/script\>');
</script>
<script src="/static/js/jweixin-1.0.0.js"></script>
<script src="/static/js/wxshare.js?version=20220630"></script>
</html>
