feat: 添加审核结果页UI

This commit is contained in:
范鹏 2025-01-17 18:35:40 +08:00
parent 89b28d0103
commit 3f47f8bffe
4 changed files with 122 additions and 9 deletions

View File

@ -67,6 +67,14 @@
"disableScroll": true
}
},
{
"path": "pages/approval/approval-result",
"type": "page",
"style": {
"navigationStyle": "custom",
"disableScroll": true
}
},
{
"path": "pages/approval/approval",
"type": "page",

View File

@ -17,8 +17,12 @@
</scroll-view>
<view class="pb-safe border-#eef0f5 border-t-solid">
<view class="flex flex-items-center flex-justify-around py-3">
<view class="py-2 px-13 bg-#ef2e2f color-white rounded-2">拒绝</view>
<view class="py-2 px-13 custom-bg-blue color-white rounded-2">同意</view>
<view class="py-2 px-13 bg-#ef2e2f color-white rounded-2" @click="toResult('reject')">
拒绝
</view>
<view class="py-2 px-13 custom-bg-blue color-white rounded-2" @click="toResult('agree')">
同意
</view>
<view class="custom-color-blue text-4" @click="showActions">更多</view>
</view>
</view>
@ -33,19 +37,18 @@
</template>
<script setup lang="ts">
import { useToast } from 'wot-design-uni'
import ApprovalContent from '@/pages/approval/components/ApprovalContent.vue'
import ApprovalProcess from '@/pages/approval/components/ApprovalProcess.vue'
const toast = useToast()
const show = ref<boolean>(false)
const actions = ref([
{
name: '专审'
name: '转审',
type: 'transfer'
},
{
name: '退回'
name: '退回',
type: 'return'
},
{
name: '取消'
@ -60,7 +63,13 @@
show.value = false
}
const select = ({ item, index }) => {
toast.show(`当前选中项: ${item.title}, 下标: ${index}`)
const select = ({ item }) => {
toResult(item.type)
}
const toResult = type => {
uni.navigateTo({
url: `/pages/approval/approval-result?type=${type}`
})
}
</script>

View File

@ -0,0 +1,95 @@
<route lang="json5">
{
style: {
navigationStyle: 'custom',
disableScroll: true
}
}
</route>
<template>
<view>
<TopNavigation :title="textMap[type].title"></TopNavigation>
<view v-if="type === 'transfer'" class="bg-white mx-4 px-4 py-2 rounded-2 shadow-sm text-3.5">
<view class="flex flex-items-center pos-relative">
<view class="color-#ee322a mt-1.5 pos-absolute left--2">*</view>
<view>转审人</view>
</view>
<view class="mb-2 w-fit mr-2 mt-4">
<view
class="h-10 w-10 rounded-2 border-#255cf7 border-1 border-solid flex flex-items-center flex-justify-center box-border"
>
<wd-icon name="add" size="22px" color="#255cf7"></wd-icon>
</view>
</view>
</view>
<view v-if="type === 'return'" class="bg-white mx-4 px-4 py-2 rounded-2 shadow-sm text-3.5">
<view class="flex flex-items-center pos-relative">
<view class="color-#ee322a mt-1.5 pos-absolute left--2">*</view>
<view>退回至</view>
</view>
<view class="color-#838589 text-3 mt-2">选择退回节点对方处理后将按原有流程重新审批</view>
<view class="flex flex-items-center mt-2">
<view class="custom-bg-blue w-5 h-5 rounded-50% flex flex-items-center flex-justify-center">
<view class="w-2.5 h-2.5 bg-white rounded-50%"></view>
</view>
<view class="ml-2">发起人</view>
</view>
<view class="ml-7 mt-2 mb-2 py-1 flex flex-items-center w-fit rounded-4 bg-#f3f5fa">
<image
src="https://file.hikmall.com/prod/image/4921b7596d2344088f8611f503b011dc.png"
class="h-6 w-6 rounded-50%"
mode="aspectFill"
></image>
<view class="mx-2">xxx</view>
</view>
</view>
<view class="bg-white mx-4 p-2 rounded-2 shadow-sm mt-2">
<Textarea
:id="0"
:title="textMap[type].placeholder"
:required="false"
placeholder="请输入(选填)"
@change="textareaChange"
></Textarea>
</view>
</view>
</template>
<script setup lang="ts">
// agree reject return transfer
import Textarea from '@/pages/approval/components/Textarea.vue'
const type = ref<string>('agree')
const approvalType = ref<string>('请假')
const textMap = {
agree: {
title: '审批意见',
placeholder: `确认同意${approvalType.value}申请`
},
reject: {
title: '审批意见',
placeholder: `确认拒绝${approvalType.value}申请`
},
return: {
title: '退回',
placeholder: `退回原因`
},
transfer: {
title: '转审',
placeholder: `转审原因`
}
}
onLoad(options => {
if (options.type) {
type.value = options.type
}
})
const textareaChange = e => {
console.log('textareaChange', e)
}
</script>
<style scoped lang="scss"></style>

View File

@ -6,6 +6,7 @@
interface NavigateToOptions {
url: "/pages/home/home" |
"/pages/approval/approval-detail" |
"/pages/approval/approval-result" |
"/pages/approval/approval" |
"/pages/approval/create-application" |
"/pages/attendance/allowed-time" |