factory_web/src/views/wf/workdetail.vue

173 lines
6.0 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<el-container>
<el-main class="nopadding">
<el-card style="margin-bottom: 10px">
<el-steps
:active="actives"
spac="400px"
align-center=""
style="padding-top: 20px"
>
<el-step
:title="item.name"
v-for="item in flowSteps"
:key="item.id"
></el-step>
</el-steps>
</el-card>
<el-row>
<el-col :span="24">
<el-card style="margin-left: 10px">
<p style="text-align: center;font-size: 20px">{{ticketDetail.title}}</p>
<el-col :span="12">
<div class="items">
<span class="itemLabel">工作流:</span>
<span>{{ticketDetail.workflow_.name}}</span>
</div>
</el-col>
<el-col :span="12">
<div class="items">
<span class="itemLabel">流水号:</span>
<span>{{ticketDetail.sn}}</span>
</div>
</el-col>
<el-col :span="12">
<div class="items">
<span class="itemLabel">创建时间:</span>
<span>{{ticketDetail.create_time}}</span>
</div>
</el-col>
<el-col v-for="item in ticketDetail.ticket_data_" :key="item.id" :span="12">
<div class="items">
<span class="itemLabel">{{item.field_name}}</span>
<span>{{item.field_display}}</span>
</div>
</el-col>
</el-card>
<el-card style="margin-left: 10px">
<el-table
:data="logs"
fit
stripe
style="width: 100%; border-top: 1px solid #ebeef5"
height="500"
highlight-current-row
>
<el-table-column label="工单标题" min-width="100">
<template #default="scope">
<span v-if="scope.row.ticket_data.title">{{ scope.row.ticket_data.title }}</span>
</template>
</el-table-column>
<el-table-column label="进行状态" min-width="100">
<template #default="scope">
<span v-if="scope.row.state_.type == 0"
>{{ scope.row.state_.name }}中</span
>
<span v-else>已{{ scope.row.state_.name }}</span>
</template>
</el-table-column>
<el-table-column label="操作人" min-width="100">
<template #default="scope" ><el-span v-if="scope.row.participant_">{{
scope.row.participant_.name
}}</el-span></template>
</el-table-column>
<el-table-column
label="操作意见"
min-width="100"
prop="suggestion"
>
</el-table-column>
<el-table-column
label="更新时间"
min-width="100"
prop="update_time"
>
</el-table-column>
</el-table>
</el-card>
</el-col>
</el-row>
</el-main>
</el-container>
</template>
<script>
export default {
name: "workdetail",
data() {
return {
actives: 4,
flowSteps: [],
workId: "",
ticketDetail: [],
logs: [],
};
},
mounted() {
this.workId = this.$route.query.id;
this.getFlowSteps();
},
methods: {
async getFlowSteps() {
let res = await this.$API.wf.ticket.ticketFlowSteps.req(this.workId);
console.log(res);
this.flowSteps = res;
this.$API.wf.ticket.ticketItem.req(this.workId).then((res) => {
this.ticketDetail = res
for (let i = 0; i < this.ticketDetail.ticket_data_.length; i++) {
if (this.ticketDetail.ticket_data_[i].label === "sys_user") {
this.ticketDetail.ticket_data_[i].field_choice = that.staffs;
}
if (this.ticketDetail.ticket_data_[i].label === "deptSelect") {
this.ticketDetail.ticket_data_[i].field_choice = that.orgList;
}
}
// console.log(that.ticketDetail.state_.enable_retreat);
let state = res.state;
let dat = this.flowSteps.filter((item) => {
return item.id == state;
})
// debugger;
let state_fields = dat[0].state_fields;
if (state_fields !== {}) {
for (let labe in state_fields) {
for (let j = 0; j < this.ticketDetail.ticket_data_.length; j++) {
if (this.ticketDetail.ticket_data_[j].field_key === labe) {
// debugger;
// console.log(labe)
// console.log(state_fields[labe])
if (state_fields[labe] !== 4) {
this.ticketDetail.ticket_data_[j].is_hidden = false
} else {
this.ticketDetail.ticket_data_[j].is_hidden = true
}
}
}
}
}
that.sort = dat[0].sort;
that.actives = that.flowSteps.indexOf(dat[0]);
if (that.flowSteps.length - that.actives > 1) {
} else {
that.actives = that.flowSteps.length;
}
});
this.$API.wf.ticket.ticketFlowlogs.req(this.workId).then(res => {
this.logs = res
})
},
},
};
</script>
<style scoped>
</style>