71 lines
2.3 KiB
Vue
71 lines
2.3 KiB
Vue
<template>
|
||
<view class="page edge">
|
||
<fy-header title="发起申请" back />
|
||
<fy-scroll class="edge-scroll">
|
||
<view v-if="!canApply" class="deny">当前账号没有发起申请权限</view>
|
||
<view v-else>
|
||
<view class="search">
|
||
<input v-model="q" placeholder="搜索审批流程或申请事项..." />
|
||
</view>
|
||
<view v-for="g in groups" :key="g.category" class="block">
|
||
<text class="cat">{{ g.category }}</text>
|
||
<view class="card">
|
||
<view v-for="k in g.items" :key="k.kind" class="item" @click="open(k)">
|
||
<view>
|
||
<text class="t">{{ k.title }}</text>
|
||
<text class="d">{{ k.hint }}</text>
|
||
</view>
|
||
<text class="arr">›</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</fy-scroll>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import FyHeader from '../../components/fy-header.vue'
|
||
import FyScroll from '../../components/fy-scroll.vue'
|
||
import { store } from '../../utils/store.js'
|
||
import { groupedApplyKinds, visibleApplyKinds } from '../../utils/apply.js'
|
||
|
||
export default {
|
||
components: { FyHeader, FyScroll },
|
||
data() { return { q: '' } },
|
||
computed: {
|
||
canApply() { return store.can('personal', 'apply') },
|
||
groups() {
|
||
const me = store.me || {}
|
||
let kinds = visibleApplyKinds({
|
||
employeeStatus: me.employeeStatus,
|
||
isSuper: me.isSuper,
|
||
role: me.title
|
||
})
|
||
if (this.q.trim()) {
|
||
const q = this.q.trim()
|
||
kinds = kinds.filter((k) => (k.title + k.hint + k.group).includes(q))
|
||
}
|
||
return groupedApplyKinds(kinds)
|
||
}
|
||
},
|
||
methods: {
|
||
open(k) {
|
||
uni.navigateTo({ url: '/pages/apply/form?kind=' + k.kind })
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style scoped>
|
||
.search { padding: 16rpx 24rpx; }
|
||
.search input { height: 80rpx; background: #F3F6FB; border-radius: 16rpx; padding: 0 24rpx; }
|
||
.block { margin: 8rpx 24rpx 24rpx; }
|
||
.cat { font-size: 22rpx; color: #4B5563; font-weight: 600; }
|
||
.item { display: flex; justify-content: space-between; align-items: center; padding: 24rpx; border-bottom: 1rpx solid #E8ECF2; }
|
||
.t { display: block; font-size: 28rpx; font-weight: 600; }
|
||
.d { font-size: 22rpx; color: #6B7280; }
|
||
.arr { color: #D1D5DB; }
|
||
.deny { padding: 80rpx; text-align: center; color: #6B7280; }
|
||
</style>
|