工作流
parent
33cbd6c8b6
commit
94cb133273
@ -0,0 +1,308 @@
|
|||||||
|
<template>
|
||||||
|
<div class="app-container form-box" style="padding: 20px">
|
||||||
|
<el-form ref="form" :model="form" :rules="rules" label-width="120px">
|
||||||
|
<el-card class="top15">
|
||||||
|
<div class="table-card">
|
||||||
|
<el-row type="flex" justify="space-around">
|
||||||
|
<el-col :span="8"></el-col>
|
||||||
|
<el-col :span="8" class="formTitle"> {{ title }}</el-col>
|
||||||
|
<el-col :span="8" style="text-align: right; padding-right: 20px">
|
||||||
|
<BottomBtn
|
||||||
|
:accessId="accessId"
|
||||||
|
:isAuthorised="isAuthorised"
|
||||||
|
@onConfirm="handleBtTottom"
|
||||||
|
/>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
</div>
|
||||||
|
<div class="table-card table-card-content">
|
||||||
|
<el-row>
|
||||||
|
<el-col :span="8">
|
||||||
|
<el-form-item label="借阅申请编码" prop="borrowCode">
|
||||||
|
<el-input
|
||||||
|
v-model="form.borrowCode"
|
||||||
|
:disabled="disabled"
|
||||||
|
placeholder="请输入借阅申请编码"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="8">
|
||||||
|
<el-form-item label="申请人">
|
||||||
|
<CommonName str="an" />
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="8">
|
||||||
|
<el-form-item label="申请部门">
|
||||||
|
<CommonName str="apt" />
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
<el-row>
|
||||||
|
<el-col :span="8">
|
||||||
|
<el-form-item label="预计归还日期" prop="returnTime">
|
||||||
|
<el-date-picker
|
||||||
|
class="formItemFullWidth"
|
||||||
|
:disabled="disabled"
|
||||||
|
clearable
|
||||||
|
v-model="form.returnTime"
|
||||||
|
type="date"
|
||||||
|
value-format="timestamp"
|
||||||
|
placeholder="选择预计归还日期"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="8">
|
||||||
|
<el-form-item label="借阅方式" prop="way">
|
||||||
|
<el-select
|
||||||
|
v-model="form.way"
|
||||||
|
:disabled="disabled"
|
||||||
|
placeholder="请选择借阅方式"
|
||||||
|
class="formItemFullWidth"
|
||||||
|
>
|
||||||
|
<el-option
|
||||||
|
v-for="item in wayOptions"
|
||||||
|
:key="item.id"
|
||||||
|
:value="item.value"
|
||||||
|
:label="item.label"
|
||||||
|
>
|
||||||
|
</el-option>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="8">
|
||||||
|
<el-form-item label="档案介质" prop="media">
|
||||||
|
<el-select
|
||||||
|
v-model="form.media"
|
||||||
|
:disabled="disabled"
|
||||||
|
placeholder="请选择档案介质"
|
||||||
|
class="formItemFullWidth"
|
||||||
|
>
|
||||||
|
<el-option
|
||||||
|
v-for="item in mediaOptions"
|
||||||
|
:key="item.id"
|
||||||
|
:value="item.value"
|
||||||
|
:label="item.label"
|
||||||
|
>
|
||||||
|
</el-option>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
<el-row>
|
||||||
|
<el-col :span="8">
|
||||||
|
<el-form-item label="借阅档案" prop="recordId">
|
||||||
|
<el-select
|
||||||
|
v-model="form.recordId"
|
||||||
|
:disabled="disabled"
|
||||||
|
clearable
|
||||||
|
filterable
|
||||||
|
placeholder="请选择借阅档案"
|
||||||
|
class="formItemFullWidth"
|
||||||
|
>
|
||||||
|
<el-option
|
||||||
|
v-for="item in filesNumOptions"
|
||||||
|
:key="item.id"
|
||||||
|
:value="item.id"
|
||||||
|
:label="item.filesNum"
|
||||||
|
>
|
||||||
|
</el-option>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
<el-row>
|
||||||
|
<el-col :span="24">
|
||||||
|
<el-form-item label="申请事由" prop="reason">
|
||||||
|
<el-input
|
||||||
|
type="textarea"
|
||||||
|
:disabled="disabled"
|
||||||
|
size="small"
|
||||||
|
:rows="5"
|
||||||
|
v-model="form.reason"
|
||||||
|
placeholder="请输入"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
</div>
|
||||||
|
</el-card>
|
||||||
|
</el-form>
|
||||||
|
|
||||||
|
<!-- 打印信息 -->
|
||||||
|
<el-dialog
|
||||||
|
:visible.sync="showPrintPage"
|
||||||
|
width="1200px"
|
||||||
|
custom-class="print-dialog"
|
||||||
|
style="height: 98vh; overflow-y: auto"
|
||||||
|
>
|
||||||
|
<div style="text-align: right; margin-bottom: 10px">
|
||||||
|
<el-button @click="PrintRow" type="primary" size="mini" plain
|
||||||
|
>确认打印</el-button
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
<div id="printMe" ref="print" class="print-main">
|
||||||
|
<print-html :infoForm="form" dialogTitle="借阅申请单" :tasks="tasks" />
|
||||||
|
</div>
|
||||||
|
</el-dialog>
|
||||||
|
<!-- 审批流程信息 -->
|
||||||
|
<FlowDialog
|
||||||
|
ref="FlowDialog"
|
||||||
|
:isOpen="showFlow"
|
||||||
|
@onCancel="showFlow = false"
|
||||||
|
@onSetId="handleSetApprovalId"
|
||||||
|
@onTasks="handleTasks"
|
||||||
|
:processInstanceId="form.processInstanceId"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { createBorrowApply, getBorrowApply } from "@/api/borrow/apply";
|
||||||
|
import { debounce } from "lodash";
|
||||||
|
import { listData } from "@/api/system/dict/data";
|
||||||
|
import { getRecordList } from "@/api/archives/record";
|
||||||
|
|
||||||
|
export default {
|
||||||
|
name: "supplierTb",
|
||||||
|
components: {
|
||||||
|
printHtml: () => import("./printHtml"),
|
||||||
|
CommonName: () => import("@/components/CommonName"),
|
||||||
|
FlowDialog: () => import("@/components/FlowDialog"),
|
||||||
|
BottomBtn: () => import("@/components/BottomBtn"),
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
loading: true,
|
||||||
|
isAuthorised: false,
|
||||||
|
accessId: null,
|
||||||
|
tasks: {},
|
||||||
|
showFlow: false,
|
||||||
|
showPrintPage: false,
|
||||||
|
form: {
|
||||||
|
borrowCode: undefined,
|
||||||
|
reason: null,
|
||||||
|
returnTime: null,
|
||||||
|
way: null,
|
||||||
|
media: null,
|
||||||
|
recordId: null,
|
||||||
|
},
|
||||||
|
// 表单校验
|
||||||
|
rules: {
|
||||||
|
reason: [{ required: true, message: "请输入", trigger: "blur" }],
|
||||||
|
recordId: [
|
||||||
|
{ required: true, message: "借阅档案不能为空", trigger: "blur" },
|
||||||
|
],
|
||||||
|
},
|
||||||
|
userList: [],
|
||||||
|
index: 0,
|
||||||
|
wayOptions: [], //借阅方式
|
||||||
|
mediaOptions: [], //档案介质
|
||||||
|
filesNumOptions: [], //借阅档案
|
||||||
|
};
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
disabled() {
|
||||||
|
return !["add", "edit"].includes(this.$route.query.flag);
|
||||||
|
},
|
||||||
|
title() {
|
||||||
|
return this.$route.query.title;
|
||||||
|
},
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
if (this.$route.query.id) {
|
||||||
|
this.handleInitForm(this.$route.query.id);
|
||||||
|
}
|
||||||
|
this.getFiles();
|
||||||
|
this.handleInitList();
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
// 获取借阅档案
|
||||||
|
getFiles() {
|
||||||
|
getRecordList({ ids: "", fileNum: "" }).then((res) => {
|
||||||
|
this.filesNumOptions = res.data;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
handleSetApprovalId(id) {
|
||||||
|
this.accessId = id;
|
||||||
|
},
|
||||||
|
handleBtTottom(val) {
|
||||||
|
if (val === 0 || val === 1) {
|
||||||
|
this.submitForm(val);
|
||||||
|
} else if (val == 2) {
|
||||||
|
this.showPrintPage = true;
|
||||||
|
} else {
|
||||||
|
this.showFlow = true;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
handleTasks(tasks) {
|
||||||
|
this.tasks = tasks;
|
||||||
|
},
|
||||||
|
PrintRow: debounce(function () {
|
||||||
|
//确认打印档案
|
||||||
|
this.$print(this.$refs.print);
|
||||||
|
}, 200),
|
||||||
|
handlePrint() {
|
||||||
|
this.showPrintPage = true;
|
||||||
|
},
|
||||||
|
//获取字典数据
|
||||||
|
handleInitList() {
|
||||||
|
// 获取借阅申请方式
|
||||||
|
listData({
|
||||||
|
pageNo: 1,
|
||||||
|
pageSize: 100,
|
||||||
|
dictType: "way_type",
|
||||||
|
}).then((res) => {
|
||||||
|
this.wayOptions = res.data.list || [];
|
||||||
|
});
|
||||||
|
// 获取档案介质
|
||||||
|
listData({
|
||||||
|
pageNo: 1,
|
||||||
|
pageSize: 100,
|
||||||
|
dictType: "media_type",
|
||||||
|
}).then((res) => {
|
||||||
|
this.mediaOptions = res.data.list || [];
|
||||||
|
});
|
||||||
|
},
|
||||||
|
// 获取详情
|
||||||
|
handleInitForm(id) {
|
||||||
|
this.processInstanceLoading = true;
|
||||||
|
getBorrowApply(id).then((response) => {
|
||||||
|
this.form = response.data || {};
|
||||||
|
this.$nextTick(() => {
|
||||||
|
this.form.processInstanceId &&
|
||||||
|
this.$refs.FlowDialog.getDetail(this.form.processInstanceId);
|
||||||
|
});
|
||||||
|
this.isAuthorised = this.form.isAuthorised;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
submitForm(type) {
|
||||||
|
this.$refs["form"].validate((valid) => {
|
||||||
|
if (!valid) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
// 添加/修改的提交
|
||||||
|
let newForm = {
|
||||||
|
...this.form,
|
||||||
|
status: type,
|
||||||
|
};
|
||||||
|
createBorrowApply(newForm).then((response) => {
|
||||||
|
this.$modal.msgSuccess(`${this.form.id ? "修改成功!" : "新增成功!"}`);
|
||||||
|
history.back();
|
||||||
|
});
|
||||||
|
});
|
||||||
|
},
|
||||||
|
cancel() {
|
||||||
|
this.$emit("onCancel");
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
@import "@/assets/styles/form/index.scss";
|
||||||
|
.my-process-designer {
|
||||||
|
background: #fff !important;
|
||||||
|
}
|
||||||
|
.formItemFullWidth {
|
||||||
|
width: 100% !important;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
Loading…
Reference in New Issue