store-manage-app/src/pages/business/list.vue

131 lines
3.6 KiB
Vue

<template>
<view>
<CuNavbar title="出差报备">
<template #right>
<view @click="goPath('/pages/business/create')" class="text-24rpx text-white">申请</view>
</template>
</CuNavbar>
<uv-sticky bgColor="#fff">
<uv-tabs
:activeStyle="{ color: '#ee2c37' }"
:scrollable="false"
lineColor="#ee2c37"
:list="tabList"
@change="tabChange"
></uv-tabs>
</uv-sticky>
<MescrollItem
ref="mescrollItem0"
:top="88"
:i="0"
:index="tabIndex"
:apiUrl="tabList[0].apiUrl"
>
<template v-slot="{ list }">
<view class="space-y-15rpx p-base">
<ListItem
v-for="item in list" :key="item.id"
title="出差报备"
:status-text="statusFun(item.workflow_check.check_status, 'statusExpense', 'name')"
:status-color="statusFun(item.workflow_check.check_status, 'statusExpense', 'color')"
:body="[
{label: '目的地: ', value: item.address},
{label: '出差事由: ', value: item.reason},
{label: '申请时间: ', value: item.created_format},
]"
@click="applyDetail(item)"
/>
</view>
</template>
</MescrollItem>
<MescrollItem
ref="mescrollItem1"
:top="88"
:i="1"
:index="tabIndex"
:apiUrl="tabList[1].apiUrl"
:params="tabList[1].params"
>
<template v-slot="{ list }">
<view class="space-y-15rpx p-base">
<ListItem
v-for="item in list" :key="item.id"
title="出差报备"
:status-text="statusFun( item.check_status,'statusExpense2','name')"
:status-color="statusFun( item.check_status,'statusExpense2','color')"
:body="[
{label: '申请人: ', value: item.check.subject.employee.name},
{label: '目的地: ', value: item.check.subject.address},
{label: '出差事由: ', value: item.check.subject.reason},
{label: '申请时间: ', value: item.check.subject.created_format},
]"
@click="checkDetail(item)"
/>
</view>
</template>
</MescrollItem>
</view>
</template>
<script setup>
import CuNavbar from '@/components/cu-navbar/index'
import { ref } from 'vue'
import { onPageScroll, onReachBottom, onLoad } from '@dcloudio/uni-app'
import useMescrollMore from '@/uni_modules/mescroll-uni/hooks/useMescrollMore.js'
import MescrollItem from '@/components/mescroll-api/more.vue'
import statusFun from "@/utils/status"
import ListItem from '@/components/list-item'
const tabList = ref([
{
name: '我的出差',
apiUrl: '/hr/offical-bussiness',
},
{
name: '出差审核',
apiUrl: '/workflow',
params: {
subject_type: 'offical_business',
include: 'check.subject.employee',
},
},
])
const mescrollItem0 = ref(null)
const mescrollItem1 = ref(null)
const mescrollItems = [mescrollItem0, mescrollItem1]
const { tabIndex, getMescroll, scrollToLastY } = useMescrollMore(
mescrollItems,
onPageScroll,
onReachBottom
)
onLoad(() => {
uni.$on('refresh', () => {
mescrollItem0?.value?.getMescroll()?.resetUpScroll()
mescrollItem1?.value?.getMescroll()?.resetUpScroll()
})
})
const goPath = (url) => {
uni.navigateTo({
url,
})
}
const tabChange = ({ index }) => {
tabIndex.value = index
scrollToLastY()
}
const applyDetail = (item) => {
uni.navigateTo({
url: `/pages/business/detail?id=${item.id}`
})
}
const checkDetail = (item) => {
uni.navigateTo({
url: `/pages/audits/detail?id=${item.id}&type=${item.check.subject_type}`
})
}
</script>