81 lines
2.1 KiB
Vue
81 lines
2.1 KiB
Vue
<template>
|
|
<a-card :bordered="false" title="小组成员">
|
|
<template #extra>
|
|
<a-tooltip>
|
|
<template #title>邀请加入</template>
|
|
<UserAddOutlined @click="onShowQrcode" :style="{ fontSize: '18px' }" />
|
|
</a-tooltip>
|
|
</template>
|
|
<a-list
|
|
class="demo-loadmore-list"
|
|
item-layout="horizontal"
|
|
:data-source="list"
|
|
>
|
|
<template #renderItem="{ item }">
|
|
<a-list-item>
|
|
<template #actions>
|
|
<a-popover>
|
|
<template #content> 待处理 </template>
|
|
<a class="ele-text-danger">{{ item.pending }}</a>
|
|
</a-popover>
|
|
<a-popover>
|
|
<template #content> 本月已处理 </template>
|
|
<a class="ele-text-secondary">{{ item.month }}</a>
|
|
</a-popover>
|
|
</template>
|
|
<a-skeleton avatar :title="false" :loading="!!item.loading" active>
|
|
<a-list-item-meta>
|
|
<template #title>
|
|
{{ item.nickname }}
|
|
</template>
|
|
<template #avatar>
|
|
<a-avatar :src="item.avatar" />
|
|
</template>
|
|
</a-list-item-meta>
|
|
</a-skeleton>
|
|
</a-list-item>
|
|
</template>
|
|
</a-list>
|
|
<!-- 工单二维码 -->
|
|
<Qrcode v-model:visible="showQrcode" />
|
|
</a-card>
|
|
</template>
|
|
|
|
<script lang="ts" setup>
|
|
import { ref } from 'vue';
|
|
import { pageTaskCount } from '@/api/oa/task-count';
|
|
import { TaskCount } from '@/api/oa/task-count/model';
|
|
import { UserAddOutlined } from '@ant-design/icons-vue';
|
|
import Qrcode from './qrcode.vue';
|
|
|
|
const showQrcode = ref(false);
|
|
const list = ref<TaskCount[]>([]);
|
|
|
|
pageTaskCount({ limit: 10, roleCode: 'commander' }).then((res) => {
|
|
if (res) {
|
|
list.value = res?.list;
|
|
}
|
|
});
|
|
|
|
const onShowQrcode = () => {
|
|
showQrcode.value = true;
|
|
};
|
|
</script>
|
|
|
|
<style lang="less" scoped>
|
|
.monitor-evaluate-text {
|
|
width: 90px;
|
|
flex-shrink: 0;
|
|
white-space: nowrap;
|
|
opacity: 0.8;
|
|
|
|
& > .anticon {
|
|
font-size: 12px;
|
|
margin: 0 6px 0 8px;
|
|
}
|
|
}
|
|
/deep/.ant-list-item {
|
|
padding: 7px 0;
|
|
}
|
|
</style>
|