<template>
  <div class="AppDutyList">
    <div class="select" @click="show=true">陈锐-超管<u-icon name="arrow-down" color="#999" size="24"></u-icon></div>
    <u-select v-model="show" :list="typeList"></u-select>
    <div class="content">
      <u-table>
        <u-tr>
          <u-th width="24%">星期</u-th>
          <u-th width="24%">姓名</u-th>
          <u-th width="24%">部门</u-th>
          <u-th width="28%">手机号</u-th>
        </u-tr>
        <u-tr v-for="(item, index) in list" :key="index">
          <u-td width="24%">{{$dict.getLabel('dutyStatus', item.dutyStatus)}}</u-td>
          <u-td width="24%">{{item.name}}</u-td>
          <u-td width="24%">{{item.departmentName}}</u-td>
          <u-td width="28%">{{item.phone}}</u-td>
        </u-tr>
      </u-table>
    </div>
  </div>
</template>

<script>
import {mapState} from "vuex";

export default {
  name: 'AppDutyList',
  appName: '值班人员列表',
  data() {
    return {
      list: [],
      show: false,
      typeList: [{value: '1',label: '陈锐-超管'}]
    }
  },
  computed: {
    ...mapState(['user']),
  },
  created() {
    this.$dict.load('dutyStatus').then(() => {
      this.getList()
    })
  },
  onShow() {
    document.title = '值班人员列表'
  },
  methods: {
    getList() {
      this.$http.post('/app/appdutyuserinfo/list').then((res) => {
        if (res.code == 0) {
          this.list = res.data.records
        }
      })
    },
  },
}
</script>

<style lang="scss" scoped>
uni-page-body {
  min-height: 100%;
  // height: 100vh;
  background: #fff;
}
.AppDutyList {
  padding: 0 16px;
  .select {
    text-align: right;
    padding: 32px 0;
  }
}
</style>
