<template>
  <view class="uni-app">
    <view class="status-bar" />
    <view class="main-container">
      <wk-nav-bar :title="title" />
			
      <view class="container">
        <wk-scroll-view
          :status="listStatus"
          class="list-scroll"
          @refresh="getList(true)"
          @loadmore="getList()">
          <legwork-item
            v-for="(item, index) in listData"
            :key="index"
            :item-data="item"
            @delete="handleToDelete" />
        </wk-scroll-view>
      </view>
    </view>
		
    <uni-popup ref="popup" type="dialog">
      <uni-popup-dialog
        :content="dialogMsg"
        type="warning"
        @confirm="handleDialogConfirm" />
    </uni-popup>
  </view>
</template>

<script>
  import { LegworkList, DeleteById } from 'API/oa/legwork'

  import LegworkItem from './component/legworkItem'

  import mainListMixins from '@/mixins/mainList.js'
  import { mapGetters } from 'vuex'
	
  export default {
    name: 'LegworkListForUser',
    components: {
      LegworkItem
    },
    mixins: [mainListMixins],
    data() {
      return {
        title: '',
        loading: false,

        userId: null,
				
        dialogMsg: '',
        selectedId: null,
      }
    },
    computed: {
      ...mapGetters({
        userInfo: 'user/userInfo'
      })
    },
    onLoad(options) {
      let query = options || {}
      this.title = query.title
      this.userId = query.userId || null
      this.listParams = {
        ...this.listParams,
        startTime: query.startTime,
        endTime: query.endTime
      }
      this.getList()
    },
    methods: {
      getList(flag = false) {
        if (this.loading) return
        this.loading = true

        if (flag) {
          this.listParams.page = 0
        }
        this.listParams.page++
        this.listStatus = 'loading'
        LegworkList({
          userId: this.userId,
          ...this.listParams,
        }).then(res => {
          this.loading = false
          if (this.listParams.page === 1) {
            this.listData = []
          }
          this.listData = this.listData.concat(res.list)
          if (res.hasOwnProperty('lastPage')) {
            this.listStatus = res.lastPage ? 'noMore' : 'more'
          } else {
            this.listStatus = res.list.length === 0 ? 'noMore' : 'more'
          }
        }).catch(() => {
          this.loading = false
          this.listStatus = 'more'
        })
      },
			
      handleToDelete(id) {
        this.selectedId = id
        this.dialogMsg = '您确定要删除这一条外勤记录吗？'
        this.$refs.popup.open()
      },
			
      handleDialogConfirm(next) {
        next()
        DeleteById({
          activityId: this.selectedId
        }).then(() => {
          this.$toast('删除成功！')
          this.getList(true)
        }).catch()
      },
    }
  }
</script>

<style scoped lang="scss">
  .main-container {
    .container {
      width: 100%;
      flex: 1;
      display: flex;
      flex-direction: column;
      overflow: hidden;
    }
  }
</style>
