更新市场部长任务审批

This commit is contained in:
weipengfei 2023-10-19 18:09:50 +08:00
parent 66e6c3889c
commit 217d58da50
4 changed files with 616 additions and 13 deletions

View File

@ -0,0 +1,290 @@
<template>
<div class="edit-popup">
<popup
ref="popupRef"
:title="popupTitle"
:async="true"
width="800px"
@confirm="handleSubmit"
@close="handleClose"
:button="mode == 'edit'"
:clickModalClose="mode == 'details'"
>
<el-form
ref="formRef"
:model="formData"
:rules="formRules"
label-width="120px"
>
<el-row>
<el-col :span="12">
<el-form-item label="ID" prop="id">
<el-input readonly v-model="formData.id" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="任务名称" prop="task.title">
<el-input readonly v-model="formData.task.title" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="任务金额" prop="task.money">
<el-input readonly v-model="formData.task.money" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="所属公司" prop="company_name">
<el-input readonly v-model="formData.company_name" />
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="任务描述" prop="task.content">
<el-input
readonly
v-model="formData.task.content"
clearable
type="textarea"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="任务提交时间" prop="id">
<el-input readonly v-model="formData.task.update_time" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="片区经理" prop="flow_cate">
<el-input readonly v-model="formData.area_manager" />
</el-form-item>
</el-col>
</el-row>
<el-divider />
<el-row>
<el-col :span="24">
<el-form-item label="详情描述" prop="remark">
<el-input
readonly
:value="formData.task?.extend?.other?.note"
clearable
type="textarea"
/>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="图片附件">
<el-image
class="attachment"
v-for="(item, index) in formData.task?.extend?.other?.annex"
:key="index"
:src="item"
:preview-src-list="formData.task?.extend?.other?.annex"
:initial-index="index"
fit="cover"
></el-image>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="视频附件">
<video
class="video"
:src="item"
v-for="(item, index) in formData.task?.extend?.other
?.video_annex"
:key="index"
controls
/>
</el-form-item>
</el-col>
</el-row>
<el-divider />
<!-- <el-col :span="24">
<el-form-item label="">
<el-timeline>
<el-timeline-item
v-for="(activity, index) in activities"
:key="index"
:type="activity.type"
:hollow="activity.hollow"
:timestamp="activity.timestamp"
>
{{ activity.content }}
</el-timeline-item>
</el-timeline>
</el-form-item>
</el-col> -->
<el-col :span="12">
<el-form-item
label="审核"
prop="check_status"
clearable
:style="{ width: '100%' }"
>
<el-radio-group
:disabled="mode == 'details'"
v-model="formData.check_status"
>
<el-radio :label="2">通过</el-radio>
<el-radio :label="3">驳回</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-row>
<el-col>
<el-form-item label="备注" prop="remark">
<el-input
:readonly="mode == 'details'"
v-model="formData.remark"
clearable
type="textarea"
/>
</el-form-item>
</el-col>
</el-row>
</el-form>
</popup>
</div>
</template>
<script lang="ts" setup name="flowEdit">
import type { FormInstance } from "element-plus";
import Popup from "@/components/popup/index.vue";
import { apiApproveAudit } from "@/api/examined";
import { timeFormat } from "@/utils/util";
import type { PropType } from "vue";
defineProps({
dictData: {
type: Object as PropType<Record<string, any[]>>,
default: () => ({}),
},
});
const isCompany = ref(false);
const emit = defineEmits(["success", "close"]);
const formRef = shallowRef<FormInstance>();
const popupRef = shallowRef<InstanceType<typeof Popup>>();
const mode = ref("add");
//
const popupTitle = computed(() => {
return mode.value == "edit" ? "审核" : "详情";
});
const activities = ref([
{
content: "任务完成",
timestamp: "2023-8-28 13:30:00",
},
{
content: "张三三审核",
timestamp: "2023-8-28 13:30:00",
},
{
content: "李思思审核",
timestamp: "2023-8-28 13:30:00",
type: "primary",
hollow: true,
},
]);
//
const formData = reactive({
id: "",
task: {},
company_name: "",
area_manager: "",
check_status: 1,
remark: "",
});
//
const formRules = reactive<any>({
check_status: [
{
required: true,
validator: (rules: any, value: any, callback: any) => {
if (value != 2 && value != 3) callback("请选择审核状态");
else callback();
},
trigger: ["blur"],
},
],
// remark: [
// {
// required: false,
// validator: (rules: any, value: any, callback: any) => {
// if (formData.check_status == 3) callback("");
// else callback();
// },
// trigger: ["blur"],
// },
// ],
});
function customEvent(data: any) {
isCompany.value = false;
}
//
const setFormData = async (data: Record<any, any>) => {
// let res = await apiFlowDetil(data.id);
for (const key in formData) {
if (data[key] != null && data[key] != undefined) {
//@ts-ignore
formData[key] = data[key];
}
}
};
const getDetail = async (row: Record<string, any>) => {
// const data = await apiFlowDetail({
// id: row.id,
// });
// setFormData(data);
};
//
const handleSubmit = async () => {
await formRef.value?.validate();
if (formData.check_status == 3 && formData.remark == "")
return ElMessage.error("驳回必须填写备注");
await apiApproveAudit({
id: formData.id,
check_status: formData.check_status,
remark: formData.remark,
});
popupRef.value?.close();
emit("success");
};
//
const open = (type = "add") => {
mode.value = type;
popupRef.value?.open();
};
//
const handleClose = () => {
emit("close");
};
defineExpose({
open,
setFormData,
getDetail,
});
</script>
<style lang="scss" scoped>
:deep(.el-timeline-item__wrapper) {
top: -8px !important;
}
.attachment {
width: 150px;
height: 150px;
/* background-color: red; */
margin-right: 10px;
margin-bottom: 10px;
}
.video {
width: 300px;
height: 150px;
/* background-color: red; */
margin-right: 10px;
margin-bottom: 10px;
}
</style>

View File

@ -0,0 +1,295 @@
<template>
<div class="edit-popup">
<popup
ref="popupRef"
:title="popupTitle"
:async="true"
width="800px"
@confirm="handleSubmit"
@close="handleClose"
:button="mode == 'edit'"
:clickModalClose="mode == 'details'"
>
<el-form
ref="formRef"
:model="formData"
:rules="formRules"
label-width="120px"
>
<el-row>
<el-col :span="12">
<el-form-item label="ID" prop="id">
<el-input readonly v-model="formData.id" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="任务名称" prop="task.title">
<el-input readonly v-model="formData.task.title" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="任务金额" prop="task.money">
<el-input readonly v-model="formData.task.money" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="所属公司" prop="company_name">
<el-input readonly v-model="formData.company_name" />
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="任务描述" prop="task.content">
<el-input
readonly
v-model="formData.task.content"
clearable
type="textarea"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="任务提交时间" prop="id">
<el-input readonly v-model="formData.task.update_time" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="片区经理" prop="flow_cate">
<el-input readonly v-model="formData.area_manager" />
</el-form-item>
</el-col>
</el-row>
<el-divider />
<el-row>
<el-col :span="24">
<el-form-item label="文字说明" prop="remark">
<el-input
readonly
:value="taskExtend.remark"
clearable
type="textarea"
/>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="完成证明">
<el-image
class="attachment"
v-for="(item, index) in taskExtend.file"
:key="index"
:src="item"
:preview-src-list="taskExtend.file"
:initial-index="index"
fit="cover"
></el-image>
</el-form-item>
</el-col>
</el-row>
<el-divider />
<!-- <el-col :span="24">
<el-form-item label="">
<el-timeline>
<el-timeline-item
v-for="(activity, index) in activities"
:key="index"
:type="activity.type"
:hollow="activity.hollow"
:timestamp="activity.timestamp"
>
{{ activity.content }}
</el-timeline-item>
</el-timeline>
</el-form-item>
</el-col> -->
<el-col :span="12">
<el-form-item
label="审核"
prop="check_status"
clearable
:style="{ width: '100%' }"
>
<el-radio-group
:disabled="mode == 'details'"
v-model="formData.check_status"
>
<el-radio :label="2">通过</el-radio>
<el-radio :label="3">驳回</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-row>
<el-col>
<el-form-item label="备注" prop="remark">
<el-input
:readonly="mode == 'details'"
v-model="formData.remark"
clearable
type="textarea"
/>
</el-form-item>
</el-col>
</el-row>
</el-form>
</popup>
</div>
</template>
<script lang="ts" setup name="flowEdit">
import type { FormInstance } from "element-plus";
import Popup from "@/components/popup/index.vue";
import { apiApproveAudit } from "@/api/examined";
import { timeFormat } from "@/utils/util";
import type { PropType } from "vue";
defineProps({
dictData: {
type: Object as PropType<Record<string, any[]>>,
default: () => ({}),
},
});
const isCompany = ref(false);
const emit = defineEmits(["success", "close"]);
const formRef = shallowRef<FormInstance>();
const popupRef = shallowRef<InstanceType<typeof Popup>>();
const mode = ref("add");
//
const popupTitle = computed(() => {
return mode.value == "edit" ? "审核" : "详情";
});
const activities = ref([
{
content: "任务完成",
timestamp: "2023-8-28 13:30:00",
},
{
content: "张三三审核",
timestamp: "2023-8-28 13:30:00",
},
{
content: "李思思审核",
timestamp: "2023-8-28 13:30:00",
type: "primary",
hollow: true,
},
]);
//
const formData = reactive({
id: "",
task: {
extend: [],
},
company_name: "",
area_manager: "",
check_status: 1,
remark: "",
});
const taskExtend = reactive({
remark: "",
file: [],
});
//
const formRules = reactive<any>({
check_status: [
{
required: true,
validator: (rules: any, value: any, callback: any) => {
if (value != 2 && value != 3) callback("请选择审核状态");
else callback();
},
trigger: ["blur"],
},
],
// remark: [
// {
// required: false,
// validator: (rules: any, value: any, callback: any) => {
// if (formData.check_status == 3) callback("");
// else callback();
// },
// trigger: ["blur"],
// },
// ],
});
function customEvent(data: any) {
isCompany.value = false;
}
//
const setFormData = async (data: Record<any, any>) => {
// let res = await apiFlowDetil(data.id);
if (typeof data.extend == "string") data.extend = JSON.parse(data.extend);
for (const key in formData) {
if (data[key] != null && data[key] != undefined) {
//@ts-ignore
formData[key] = data[key];
}
}
Object.keys(taskExtend).forEach((key: string) => {
if (
formData.task.extend[key] != null &&
formData.task.extend[key] != undefined
) {
taskExtend[key] = formData.task.extend[key];
}
});
};
const getDetail = async (row: Record<string, any>) => {
// const data = await apiFlowDetail({
// id: row.id,
// });
// setFormData(data);
};
//
const handleSubmit = async () => {
await formRef.value?.validate();
if (formData.check_status == 3 && formData.remark == "")
return ElMessage.error("驳回必须填写备注");
await apiApproveAudit({
id: formData.id,
check_status: formData.check_status,
remark: formData.remark,
});
popupRef.value?.close();
emit("success");
};
//
const open = (type = "add") => {
mode.value = type;
popupRef.value?.open();
};
//
const handleClose = () => {
emit("close");
};
defineExpose({
open,
setFormData,
getDetail,
});
</script>
<style lang="scss" scoped>
:deep(.el-timeline-item__wrapper) {
top: -8px !important;
}
.attachment {
width: 150px;
height: 150px;
/* background-color: red; */
margin-right: 10px;
margin-bottom: 10px;
}
.video {
width: 300px;
height: 150px;
/* background-color: red; */
margin-right: 10px;
margin-bottom: 10px;
}
</style>

View File

@ -116,9 +116,16 @@
<pagination v-model="pager" @change="getLists" />
</div>
</el-card>
<edit-popup
v-if="showEdit"
ref="editRef"
<audit-other-popup
v-if="showEdit && openType == 1"
ref="auditOtherRef"
:dict-data="dictData"
@success="getLists"
@close="showEdit = false"
/>
<audit-town-market-popup
v-else-if="showEdit && openType == 4"
ref="auditTownMarketRef"
:dict-data="dictData"
@success="getLists"
@close="showEdit = false"
@ -132,17 +139,21 @@ import { useDictData } from "@/hooks/useDictOptions";
import { apiApproveList } from "@/api/examined";
import { timeFormat } from "@/utils/util";
import feedback from "@/utils/feedback";
import EditPopup from "./index_list_popup.vue";
import auditOtherPopup from "./components/audit_other.vue";
import auditTownMarketPopup from "./components/audit_town_market.vue";
const editRef = shallowRef<InstanceType<typeof EditPopup>>();
const auditOtherRef = shallowRef<InstanceType<typeof auditOtherPopup>>();
const auditTownMarketRef =
shallowRef<InstanceType<typeof auditTownMarketPopup>>();
//
const showEdit = ref(false);
const openType = ref(1);
//
const queryParams = reactive({
name: "",
check_status: "",
type: 1,
type: [1, 4],
});
const checkStatusList = ref([
@ -181,15 +192,21 @@ const { pager, getLists, resetParams, resetPage } = usePaging({
const handleAdd = async () => {
showEdit.value = true;
await nextTick();
editRef.value?.open("add");
auditOtherRef.value?.open("add");
};
//
const handleEdit = async (data: any, type = "edit") => {
openType.value = data.type;
showEdit.value = true;
await nextTick();
editRef.value?.open(type);
editRef.value?.setFormData(data);
if (data.type == 1) {
auditOtherRef.value?.open(type);
auditOtherRef.value?.setFormData(data);
} else if (data.type == 4) {
auditTownMarketRef.value?.open(type);
auditTownMarketRef.value?.setFormData(data);
}
};
//

View File

@ -64,7 +64,7 @@
<el-form-item label="详情描述" prop="remark">
<el-input
readonly
:value="formData.task?.extend.other.note"
:value="formData.task?.extend?.other?.note"
clearable
type="textarea"
/>
@ -74,10 +74,10 @@
<el-form-item label="图片附件">
<el-image
class="attachment"
v-for="(item, index) in formData.task.extend.other.annex"
v-for="(item, index) in formData.task?.extend?.other?.annex"
:key="index"
:src="item"
:preview-src-list="formData.task.extend.other.annex"
:preview-src-list="formData.task?.extend?.other?.annex"
:initial-index="index"
fit="cover"
></el-image>
@ -88,7 +88,8 @@
<video
class="video"
:src="item"
v-for="(item, index) in formData.task.extend.other.video_annex"
v-for="(item, index) in formData.task?.extend?.other
?.video_annex"
:key="index"
controls
/>