<template>
  <div style="padding-top: 14vw">
    <TopNav navTitle="值班情况" :showRight="false" :showLeft="true" />
    <div class="list_item" v-for="(item,index) in list" :key="index+'zbqk'">
        <span>{{item.ssbmmc}}</span>
        <span>{{setDict(item.type,dict)}}</span>
    </div>
  </div>
</template>

<script setup>
import TopNav from "../../components/topNav.vue";
import { getBbListByDept } from "../../api/ldjsc.js";
import { setDict } from "../../utils/dict";
import { onMounted, ref } from "vue";
import { Toast } from "vant";
const dict = [
    {text:'未排班',value:'wpb'},
    {text:'已报备',value:'ybb'},
    {text:'未报备',value:'wbb'}
]
const list = ref([]);
function getList() {
    Toast.loading({
    message: "加载...",
    forbidClick: true,
    loadingType: "spinner",
    duration: 0,
  });
  getBbListByDept().then((res) => {
    list.value = res;
    Toast.clear();
  });
}
onMounted(() => {
  getList();
});
</script>

<style lang="scss" scoped>
@import "../../assets/styles/mixin.scss";
.list_item{
    width: 95vw;
    margin: 2vw auto;
    background: rgb(240, 242, 246);
    @include font_size($font_medium_s);
    padding: 6px 10px;
    display: flex;
    box-sizing: border-box;
    color: #333;
    justify-content: space-between;
    >span:nth-child(1){
        flex: 1;
    }
    >span:nth-child(2){
        width: 15vw;
        text-align: right;
    }
}
</style>