factory_mp/pages/wf/ticketd.vue

130 lines
4.2 KiB
Vue

<template>
<view v-if="ticket_">
<uni-forms-item label="审批状态">
<uni-tag :text="actStateEnum[ticket_?.act_state]?.text" :circle="true" size="small"
:type="actStateEnum[ticket_?.act_state]?.type" :inverted="true" style="font-weight: 460;"></uni-tag>
<span style="margin-left: 12rpx" @click="handleDetail">{{ticket_?.state_.name}}</span>
<span style="margin-left: 12rpx;color:blue" @click="handleDetail">更多</span>
</uni-forms-item>
<uni-forms-item label="操作" v-if="ticket_?.state_.enable_retreat && isOwn">
<button type="warn" size="mini" @click="handleRetreat" style="margin-left:0px">撤回</button>
</uni-forms-item>
<uni-forms-item label="可处理人" v-if="ticket_.participant_">
<span v-if="
ticket_.participant_type == 2 ||
ticket_.participant_type == 1
">
<span v-for="item in ticket_.participant_" :key="item.id">{{ item.name }}/</span>
</span>
<span v-else> 无 </span>
</uni-forms-item>
<uni-popup ref="popup" background-color="#fff">
<scroll-view scroll-y="true" style="height: 600rpx;padding: 20rpx">
<uni-forms-item label="审批状态">
<uni-tag :text="actStateEnum[ticket_f?.act_state]?.text" :circle="true" size="small"
:type="actStateEnum[ticket_f?.act_state]?.type" :inverted="true" style="font-weight: 460;"></uni-tag>
<span style="margin-left: 12rpx">{{ticket_f?.state_.name}}</span>
<button v-if="ticket_f?.state_.enable_retreat && isOwn" type="warn" size="mini" plain="true"
@click="handleRetreat">撤回</button>
</uni-forms-item>
<uni-forms-item label="可处理人" v-if="ticket_f.participant_">
<span v-if="
ticket_f.participant_type == 2 ||
ticket_f.participant_type == 1
">
<span v-for="item in ticket_f.participant_" :key="item.id">{{ item.name }}/</span>
</span>
<span v-else> 无 </span>
</uni-forms-item>
<div style="font-size: 28rpx;">
<div v-for="item in flowsteps" :key="item.id" style="margin-bottom: 16rpx;border-top: 1px solid #000;">
<div>
<strong>{{ item.state_?.name || "未知状态" }}</strong>
</div>
<div>
<span style="font-size: 22rpx">{{item.create_time}}-</span>
<span v-if="item.intervene_type != 0"><uni-tag
:type="interveneTypeEnum[item.intervene_type]?.type" :inverted="true" :circle="true"
:text="interveneTypeEnum[item.intervene_type]?.text" style="font-weight: 460;">
</uni-tag></span>
<span v-if="item.transition_"
:style="{ color: item.transition_.attribute_type === 1 ? '#67C23A' : '#F56C6C' }">
{{ item.transition_.name }}
</span>
<span v-if="item.participant_">-{{ item.participant_.name }}</span>
</div>
<div v-if="item.suggestion">
<span v-if="item.suggestion.length > 20">{{ item.suggestion.slice(0, 20) + "..." }}</span>
<span v-else>
{{ item.suggestion }}
</span>
</div>
</div>
</div>
</scroll-view>
</uni-popup>
</view>
</template>
<script setup>
import {
ref,
reactive,
onMounted,
defineEmits,
watch
} from 'vue'
import API from '@/utils/api';
import {
actStateEnum, interveneTypeEnum
} from "@/utils/enum.js"
const props = defineProps({
ticket_: {
type: Object,
default: null,
required: false
}
})
const ticket_f = ref({});
const isOwn = ref(false);
watch(
() => props.ticket_,
async (newVal) => {
if (newVal && Object.keys(newVal).length > 0) {
if(props.ticket_.create_by === uni.getStorageSync("userInfo").id){
isOwn.value = true;
}
}
},
{ immediate: false }
)
onMounted(() => {
})
const popup = ref(null);
const flowsteps = ref([]);
const handleDetail = async () => {
ticket_f.value = await API.getTicketItem(props.ticket_.id)
popup.value.open("top");
API.getTicketFlowLogs(props.ticket_.id).then(res=>{
flowsteps.value = res
})
}
const handleRetreat = () => {
uni.showModal({
title: "撤回原因",
editable: true,
success(res) {
if(res.confirm){
API.ticketRetreat(props.ticket_.id, {"suggestion": res.content}).then(res=>{
uni.navigateBack()
})
}
}
})
}
</script>