Jelajahi Sumber

我的证书样式调整

赵启卫 2 tahun lalu
induk
melakukan
e6b9d38d17

+ 6 - 0
application/wap/model/topic/CertificateRecord.php

xqd
@@ -45,9 +45,15 @@ class CertificateRecord extends ModelBasic
      */
     public static function getUserCertificate($uid, $page, $limit)
     {
+        $certificateList = Certificate::select();
+        $certificateList1 = [];
+        foreach ($certificateList as $v){
+            $certificateList1[$v['id']] = $v;
+        }
         $list = self::setWhere($uid)->page((int)$page, (int)$limit)->select();
         $list = count($list) > 0 ? $list->toArray() : [];
         foreach ($list as $key => &$value) {
+            $value['certtitle'] = $certificateList1[$value['cid']]['title'];
             $value['content'] = self::certificate($value['source_id'], $value['obtain']);
         }
         return $list;

+ 119 - 30
application/wap/view/first/my/history.html

xqd xqd xqd xqd
@@ -34,6 +34,92 @@
     .activity-list li > div > div > div:last-child {
         font-weight: normal;
     }
+
+    .honor-list-page li {
+        padding-right: .3rem;
+        padding-left: .3rem;
+        border-radius: .12rem;
+        background-color: #fff;
+    }
+
+    .honor-list-page li ~ li {
+        margin-top: .2rem;
+    }
+
+    .honor-list-page li .name {
+        overflow: hidden;
+        white-space: nowrap;
+        text-overflow: ellipsis;
+        padding: .3rem 0 0.3rem 0 !important;
+        font-size: .3rem;
+        color: #282828;
+        display: block;
+    }
+
+    .honor-list-page li .name img {
+        width: .25rem;
+        margin-right: .05rem;
+        pointer-events: none;
+        -webkit-touch-callout: none;
+        object-fit:contain;
+        height: auto;
+        display: inline;
+    }
+
+    .honor-list-page li .desc {
+        display: -webkit-box;
+        display: flex;
+        -webkit-box-pack: justify;
+        justify-content: space-between;
+        -webkit-box-align: center;
+        align-items: center;
+        height: 1.48rem;
+        border-top: 1px dashed #e3e3e3 !important;
+        font-size: .3rem;
+        color: #9e9e9e;
+    }
+
+    .honor-list-page li .attr {
+        display: -webkit-box;
+        display: flex;
+        margin-left: -.3rem;
+        font-size: .24rem;
+        text-align: center;
+        color: #999;
+    }
+
+    .honor-list-page li .cell {
+        position: relative;
+        padding-right: .35rem;
+        padding-left: .35rem;
+    }
+
+    .honor-list-page li .cell::before {
+        content: "";
+        position: absolute;
+        top: 50%;
+        left: 0;
+        height: .4rem;
+        border-left: 1px solid rgba(0, 0, 0, .05);
+        -webkit-transform: translateY(-50%);
+        transform: translateY(-50%);
+    }
+
+    .honor-list-page li .cell:first-child::before {
+        display: none;
+    }
+
+    .honor-list-page li a {
+        height: .5rem;
+        padding-right: .27rem;
+        padding-left: .27rem;
+        border: 1px solid #191C6E;
+        border-radius: .25rem;
+        font-size: .24rem;
+        line-height: .5rem;
+        text-align: center;
+        color: #191C6E;
+    }
 </style>
 {/block}
 {block name="content"}
@@ -141,34 +227,33 @@
         </ul>
         <ul v-if="navActive == 3">
             <!-- 我的证书 -->
-            <div class="credit-list">
-                <div class="content">
-                    <ul v-if="activityList.length">
-                        <li v-for="item in activityList" :key="item.id">
-                            <div class="name">
-                                <img src="{__WAP_PATH}zsff/images/question01.png">{{ item.content. title }}
-                            </div>
-                            <div class="desc">
-                                <div v-if="item.obtain === 1">您已学完关联的所有课程/专栏</div>
-                                <div v-else class="attr">
-                                    <div class="cell">
-                                        题目数
-                                        <div>{{ item.content.item_number }}</div>
-                                    </div>
-                                    <div class="cell">
-                                        错题数
-                                        <div>{{ item.content.wrong_question }}</div>
-                                    </div>
-                                    <div class="cell">
-                                        本次用时
-                                        <div>{{ item.content.duration | formatTime }}</div>
-                                    </div>
+            <div class="honor-list-page">
+                <ul v-if="activityList.length">
+                    <li v-for="item in activityList" :key="item.id">
+                        <div class="name">
+                            <img src="{__WAP_PATH}zsff/images/question01.png">{{ item.certtitle }}
+                        </div>
+                        <div class="desc">
+                            <div v-if="item.obtain === 1 || item.obtain === 3">发放时间<br />{{item.add_time}}</div>
+                            <div v-else class="attr">
+                                <div class="cell">
+                                    题目数
+                                    <div>{{ item.content.item_number }}</div>
+                                </div>
+                                <div class="cell">
+                                    错题数
+                                    <div>{{ item.content.wrong_question }}</div>
+                                </div>
+                                <div class="cell">
+                                    本次用时
+                                    <div>{{ item.content.duration | formatTime }}</div>
                                 </div>
-                                <a :href="'{:url('topic/certificate_detail')}?obtain=' + item.obtain + '&id=' + item.id">查看证书</a>
                             </div>
-                        </li>
-                    </ul>
-                </div>
+                            <a :href="'{:url('topic/certificate_detail')}?obtain=' + item.obtain + '&id=' + item.id">查看证书</a>
+                        </div>
+                    </li>
+                </ul>
+                <img v-else-if="page > 1 && !loading" class="empty" src="{__WAP_PATH}zsff/images/no_certificate.png">
             </div>
         </ul>
         <div v-if="!activityList.length && loadend" class="empty">
@@ -181,7 +266,7 @@
 {/block}
 {block name="foot"}
 <script>
-    require(['vue', 'store', 'helper', '{__WAP_PATH}zsff/js/quick.js'], function (Vue, store, $h) {
+    require(['vue', 'store', 'helper', '{__WAP_PATH}zsff/js/quick.js', 'moment'], function (Vue, store, $h, quick, moment) {
         var app = new Vue({
             el: '#app',
             data: {
@@ -239,11 +324,15 @@
                             limit: this.limit
                         }, function (res) {
                             var activityList = res.data.data;
-                            app.activityList = app.activityList.concat(activityList);
-                            app.loading = false;
+                            console.log(activityList);
+                            for (let i in activityList) {
+                                activityList[i].add_time = moment(activityList[i].add_time * 1000).format('YYYY.MM.DD')
+                            }
+                            that.activityList = that.activityList.concat(activityList);
+                            that.loading = false;
                             that.loadend = activityList.length < that.limit;
                             that.loadTitle = that.loadend ? '已全部加载完' : '上拉加载更多';
-                            app.finished = app.limit > activityList.length;
+                            that.finished = that.limit > activityList.length;
                             that.$set(this, 'activityList', that.activityList);
                         });
                     } else {

+ 2 - 2
application/wap/view/first/topic/certificate_list.html

xqd
@@ -120,10 +120,10 @@
         <ul v-if="certificateList.length">
             <li v-for="item in certificateList" :key="item.id">
                 <div class="name">
-                    <img src="{__WAP_PATH}zsff/images/question01.png">{{ item.content. title }}
+                    <img src="{__WAP_PATH}zsff/images/question01.png">{{ item.certtitle }}
                 </div>
                 <div class="desc">
-                    <div v-if="item.obtain === 1">发放时间<br />{{item.add_time}}</div>
+                    <div v-if="item.obtain === 1 || item.obtain === 3">发放时间<br />{{item.add_time}}</div>
                     <div v-else class="attr">
                         <div class="cell">
                             题目数