bugfix
This commit is contained in:
242
src/views/admin/agent/service/enterprise/update-status.vue
Normal file
242
src/views/admin/agent/service/enterprise/update-status.vue
Normal file
@ -0,0 +1,242 @@
|
||||
<script setup>
|
||||
import { ref } from "vue";
|
||||
import FileUpload from "@/components/FileUpload/index.vue";
|
||||
import {
|
||||
getTechnologyDemandUpdateStatus,
|
||||
updateDemandProcess,
|
||||
} from "@/api/admin/agent/service/technology-demand";
|
||||
import { useRoute, useRouter } from "vue-router";
|
||||
import { ElMessage } from "element-plus";
|
||||
|
||||
const active = ref(0); /*active step index*/
|
||||
const updateStatusList = ref([]); /*update status list*/
|
||||
const route = useRoute();
|
||||
const router = useRouter();
|
||||
const cooperationMemoUrl = ref(""); // 合作备忘录
|
||||
const technicalSolutionUrl = ref(""); // 客户确认技术解决方案
|
||||
const contractUrl = ref(""); // 签署服务合同（合同额）
|
||||
const conclusionUrl = ref(""); // 结题
|
||||
//未结题原因描述
|
||||
const reason = ref("");
|
||||
|
||||
// steps title, description, id
|
||||
const steps = [
|
||||
{
|
||||
title: "合作备忘录",
|
||||
description: "合作备忘录",
|
||||
id: 1,
|
||||
},
|
||||
{
|
||||
title: "客户确认技术解决方案",
|
||||
description: "客户确认技术解决方案",
|
||||
id: 2,
|
||||
},
|
||||
{
|
||||
title: "签署服务合同（合同额）",
|
||||
description: "签署服务合同（合同额）",
|
||||
id: 3,
|
||||
},
|
||||
{
|
||||
title: "结题",
|
||||
description: "结题",
|
||||
id: 4,
|
||||
},
|
||||
{
|
||||
title: "未结题",
|
||||
description: "未结题",
|
||||
id: 5,
|
||||
},
|
||||
];
|
||||
|
||||
const getUpdateStatus = async (demandId) => {
|
||||
const resp = await getTechnologyDemandUpdateStatus({
|
||||
demandId,
|
||||
});
|
||||
updateStatusList.value = resp.data.sort((a, b) => a.sort - b.sort);
|
||||
const reverseIndex = updateStatusList.value.findLastIndex(
|
||||
(item) => item.status === "1"
|
||||
);
|
||||
console.log(updateStatusList.value.length, reverseIndex);
|
||||
active.value = reverseIndex === -1 ? 0 : reverseIndex;
|
||||
};
|
||||
|
||||
const goToStep = (index) => {
|
||||
// if (index <= active.value) {
|
||||
// active.value = index;
|
||||
// }
|
||||
if (
|
||||
(active.value === 3 && index === 4) ||
|
||||
(active.value === 4 && index === 3)
|
||||
) {
|
||||
} else {
|
||||
active.value = index;
|
||||
}
|
||||
};
|
||||
const close = () => {
|
||||
router.go(-1);
|
||||
};
|
||||
const submit = () => {
|
||||
console.log(updateStatusList.value[active.value]);
|
||||
updateDemandProcess({
|
||||
...updateStatusList.value[active.value],
|
||||
status: "1",
|
||||
})
|
||||
.then((resp) => {
|
||||
ElMessage.success("操作成功");
|
||||
})
|
||||
.catch(() => {})
|
||||
.finally(() => {
|
||||
getUpdateStatus(route.query.id);
|
||||
// active.value = updateStatusList.value.findIndex((item) => item.status === "1") + 1;
|
||||
// 反向从列表中查找index
|
||||
});
|
||||
};
|
||||
|
||||
if (route.query.id) {
|
||||
getUpdateStatus(route.query.id);
|
||||
} else {
|
||||
router.go(-1);
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<h2 class="page-title">需求状态</h2>
|
||||
<div style="width: 80%; margin: 0 auto">
|
||||
<el-steps :active="active" finish-status="finish" process-status="finish">
|
||||
<el-step
|
||||
v-for="(item, index) in steps"
|
||||
:key="item.id"
|
||||
:status="active === 4 && index === 3 ? 'wait' : ''"
|
||||
:style="`cursor: ${
|
||||
(active === 4 && index === 3) || (active === 3 && index === 4)
|
||||
? 'not-allowed'
|
||||
: 'pointer'
|
||||
}`"
|
||||
:title="item.title"
|
||||
@click="goToStep(index)"
|
||||
>
|
||||
<!-- :status="active === 4 ? 'error' : ''"-->
|
||||
</el-step>
|
||||
</el-steps>
|
||||
<div v-if="updateStatusList.length" class="steps-content">
|
||||
<template
|
||||
v-for="(item, index) in steps.slice(0, active + 1)"
|
||||
:key="item.id"
|
||||
>
|
||||
<div
|
||||
v-if="
|
||||
!(index === 3 && updateStatusList[4].status !== '0') &&
|
||||
!(index === 4 && updateStatusList[3].status !== '0')
|
||||
"
|
||||
:class="`step-item ${active === index ? 'active' : ''}`"
|
||||
>
|
||||
<h3 class="title">{{ index + 1 }}.{{ item.title }}</h3>
|
||||
<div class="form-wrap">
|
||||
<el-form :model="updateStatusList[0]" label-position="top">
|
||||
<el-row v-if="index !== 4" justify="space-between">
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="`上传文件`">
|
||||
<file-upload v-model="updateStatusList[index].files" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item
|
||||
v-if="index === 2 || index === 3"
|
||||
label="金额"
|
||||
>
|
||||
<el-input-number
|
||||
v-model="updateStatusList[index].remark"
|
||||
:controls="false"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-form-item v-else label="未结题原因描述">
|
||||
<el-input
|
||||
v-model="updateStatusList[index].remark"
|
||||
:rows="5"
|
||||
type="textarea"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<div v-if="updateStatusList[index].updateTime" class="upload-time">
|
||||
<span>上传时间：</span>
|
||||
<span>{{ updateStatusList[index].updateTime }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
<div class="steps-action">
|
||||
<el-button @click="close">关闭</el-button>
|
||||
<el-button
|
||||
v-if="
|
||||
updateStatusList.length &&
|
||||
updateStatusList[3]?.status === '0' &&
|
||||
updateStatusList[4]?.status === '0'
|
||||
"
|
||||
type="primary"
|
||||
@click="submit"
|
||||
>提交
|
||||
</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.page-title {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.steps-content {
|
||||
margin-top: 36px;
|
||||
|
||||
.step-item {
|
||||
border-radius: 12px;
|
||||
//min-height: 240px;
|
||||
border-bottom: 1px solid #ebeef5;
|
||||
padding: 12px 24px;
|
||||
|
||||
&.active {
|
||||
background-color: rgba(0, 255, 127, 0.03);
|
||||
}
|
||||
|
||||
.title {
|
||||
margin: 0;
|
||||
text-align: end;
|
||||
font-size: 22px;
|
||||
font-weight: 700;
|
||||
color: #169bd5;
|
||||
}
|
||||
|
||||
.form-wrap {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: end;
|
||||
|
||||
:deep(.el-form) {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
:deep(.el-form-item__label) {
|
||||
font-size: 24px;
|
||||
font-weight: 700;
|
||||
}
|
||||
}
|
||||
|
||||
.upload-time {
|
||||
text-align: end;
|
||||
font-size: 14px;
|
||||
color: #909399;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.steps-action {
|
||||
margin-top: 20px;
|
||||
display: flex;
|
||||
justify-content: end;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user