1219

src/components/libraryListItem/index.vue

@@ -4,7 +4,7 @@
       <a>
         <img :src="data.BookImg" class="centerLabel cover" alt>
       </a>
-      <span v-if="type === 1" class="active">状态值</span>
+      <span v-if="type === 1" :class="data.BorrowStatus=='0'?'active':''">{{myBookStatus}}</span>
     </div>
     <div class="flex-item">
       <div>
@@ -22,20 +22,23 @@
           </span>
         </div>
         <div v-if="type === 1" class="flex-h" style="margin-top: .06rem;">
-          <span class="flex-item">应还时间：{{data.ReturnDate}}</span>
+          <span class="flex-item">应还时间：{{toolClass.dateFormat(data.EndDate, 'yyyy-MM-dd')}}</span>
         </div>
         <div v-if="type === 1" class="flex-h">
           <span class="flex-item">{{data.CaseName}}</span>
-          <span>已归还</span>
-          <span>已逾期
-            <em>4</em>天
+          <span v-if="data.BorrowStatus=='3' || data.BorrowStatus=='2'">已归还</span>
+          <span v-if="data.BorrowStatus == '1'">已借阅
+            <em>{{borrowDay}}</em>天
+          </span>
+          <span v-if="data.BorrowStatus == '0'">已逾期
+            <em>{{lateDay}}</em>天
           </span>
         </div>
         <div v-if="type === 2" class="flex-h" style="margin-top: .06rem;">
-          <span class="flex-item">预约时间：{{data.appointmentDate}}</span>
+          <span class="flex-item">预约时间：{{toolClass.dateFormat(data.ReserveDate)}}</span>
         </div>
         <div v-if="type === 2" class="flex-h" style="margin-top: 0;">
-          <span class="flex-item">预约资格将保留至：2018-12-08</span>
+          <span class="flex-item">预约资格将保留至：{{toolClass.dateFormat(data.ReserveEndDate, 'yyyy-MM-dd')}}</span>
         </div>
         <div v-if="type === 2" class="flex-h" style="margin-top: 0;">
           <span class="flex-item">{{data.CaseName}}</span>
@@ -46,6 +49,7 @@
 </template>
 
 <script>
+import toolClass from '../../util/util'
 
 export default {
   name: '',
@@ -58,17 +62,46 @@ export default {
     bookStatus() {
       let status = '在线预约'
       switch(this.status) {
-        case 'reserve':
+        case '4':
           status = '已预约'
           break
-        case 'borrowed':
+        case '1':
           status = '借阅中'
           break
-        case 'late':
+        case '0':
           status = '借阅中'
           break
       }
       return status
+    },
+    myBookStatus() {
+      let status = ''
+      switch(this.data.BorrowStatus) {
+        case '4':
+          status = '已预约'
+          break
+        case '1':
+          status = '借阅中'
+          break
+        case '0':
+          status = '预期未还'
+          break
+        case '3':
+          status = '逾期归还'
+          break
+        case '2':
+          status = '已归还'
+          break
+      }
+      return status
+    },
+    lateDay() {
+      const nowdata = new Date()
+      return toolClass.diffDate(new Date(this.data.EndDate), nowdata)
+    },
+    borrowDay() {
+      const nowdata = new Date()
+      return toolClass.diffDate(new Date(this.data.BorrowDate), nowdata)
     }
   },
   components: {
@@ -77,7 +110,7 @@ export default {
   },
   methods: {
     appointmentBook (id) {
-      if(this.status == 'reserve' || this.status == 'borrowed' || this.status == 'late'){
+      if(this.status == '4' || this.status == '1' || this.status == '0'){
         return
       }
       this.$emit('appointmentBook', id)

src/pages/user/library/borrowedRecord/index.vue

@@ -7,20 +7,20 @@
       normalColor="#666"
       @slideChange="slideChange"
     >
-      <div class="subMain" slot="slideTabH-borrowed">
+      <div class="subMain" slot="slideTabH-1">
         <div>
           <ul>
-            <li v-for="(item, index) in books.list" :key="index">
+            <li v-for="(item, index) in borrowBooks.list" :key="index">
               <libraryListItem :data="item" :type="1" @itemClick="borrowedRecordClick"></libraryListItem>
             </li>
           </ul>
         </div>
       </div>
-      <div class="subMain" slot="slideTabH-reserve">
+      <div class="subMain" slot="slideTabH-2">
         <div>
           <span>请在资格保留时间内至案场借阅图书，超出预约时间将取消预约资格</span>
           <ul>
-            <li v-for="(item, index) in books.list" :key="index">
+            <li v-for="(item, index) in reserveBooks.list" :key="index">
               <libraryListItem :data="item" :type="2"></libraryListItem>
             </li>
           </ul>
@@ -31,7 +31,7 @@
       <div class="borrowedRecordContent flex-h" @click="showDialog = false">
         <div class="img">
           <a>
-            <img src class="centerLabel" alt>
+            <img :src="currentItem.BookImg" class="centerLabel" alt>
           </a>
         </div>
         <div class="flex-item">
@@ -39,7 +39,7 @@
             <div>
               <span>状态值</span>
             </div>
-            <span class="title">书名</span>
+            <span class="title">{{currentItem.BookName}}</span>
             <span>借阅时间：</span>
             <span>应还时间：</span>
             <span>归还时间：</span>
@@ -58,20 +58,21 @@ const { mapState: mapBookState, mapActions: mapBookAction } = createNamespacedHe
 export default {
   data () {
     return {
-      tabList: [{ value: '借阅记录', id: 'borrowed' }, { value: '线上预约记录', id: 'reserve' }],
+      tabList: [{ value: '借阅记录', id: '1' }, { value: '线上预约记录', id: '2' }],
       showDialog: false,
-      status: 'borrowed',
+      status: '1',
       page: 1,
       pagesize: 10,
+      reserveBooks: {},
+      borrowBooks: {},
+      currentItem: {},
     }
   },
   created () {
-    this.getList()
+    this.getList('1')
+    this.getList('2')
   },
   computed: {
-    ...mapBookState({
-      books: x => x.minebooks,
-    })
   },
   components: {
     libraryListItem,
@@ -84,18 +85,26 @@ export default {
     slideChange (e) {
       if (this.status !== this.tabList[e].id) {
         this.status = this.tabList[e].id
-        this.page = 1
-        this.getList()
+        // this.page = 1
+        // this.getList()
       }
     },
     borrowedRecordClick (e) { // 借阅记录点击事件
+      this.currentItem = e
       this.showDialog = true
     },
-    getList () {
+    getList (status) {
+      const _that = this
       this.getMineBook({
         page: this.page,
         pagesize: this.pagesize,
-        status: this.status,
+        status: status == '1'?'1,3,2,0':'4',
+      }).then((res) => {
+        if(status == '1') {
+          _that.borrowBooks = res
+        } else {
+          _that.reserveBooks = res
+        }
       })
     }
   }

src/store/book/index.js

@@ -65,7 +65,8 @@ export default {
         Ajax({
           ...api.library.getBookList,
           queryData: {
-            ...payload
+            ...payload,
+            showzero: '0',
           },
         }).then(res => {
           commit('updateBookList', res)

src/util/util.js

@@ -116,6 +116,13 @@ const toolClass = {
     var time2 = date2.getFullYear()+"年"+ (date2.getMonth()+1) +"月"+date2.getDate()+"日";
     return time2;
   },
+  diffDate (begintime, endtime) {
+    var begintime_ms = Date.parse(begintime);
+    var endtime_ms = Date.parse(endtime); 
+    var date3=endtime_ms-begintime_ms
+    var days=Math.floor(date3/(24*3600*1000))
+    return days
+  },
 }
 
 export default toolClass