133 lines
4.0 KiB
Vue
133 lines
4.0 KiB
Vue
<script setup lang="ts">
|
||
import EditVersion from '@/components/publishWorkFlow/EditVersion.vue'
|
||
import EditWorkFlow from '@/components/publishWorkFlow/EditWorkFlow.vue'
|
||
import UploadImg from '@/components/publishWorkFlow/UploadImg.vue'
|
||
import { CirclePlus } from 'lucide-vue-next'
|
||
import { NConfigProvider, NMessageProvider } from 'naive-ui'
|
||
import { useRoute } from 'vue-router'
|
||
// definePageMeta({
|
||
// middleware: [
|
||
// function (to, from) {
|
||
// initFormData(to.query.type)
|
||
// },
|
||
// ],
|
||
// })
|
||
const route = useRoute()
|
||
const { type, id } = route.query
|
||
|
||
const formData = ref()
|
||
|
||
async function initFormData() {
|
||
if (type === 'add') {
|
||
formData.value = {
|
||
workFlow: {
|
||
jurisdiction: 1, // auditStatus （0全部状态 1已发布-公开 2已发布-仅自己可见 3审核中 4审核未通过）
|
||
original: 0, // original 0原创 1转载
|
||
onlineUse: 0, // 是否允许在线使用(0允许 1不允许)
|
||
download: 0, // 是否允许下载工作流(0允许 1不允许)
|
||
sell: 1, // 是否允许出售或商用(0允许 1不允许)
|
||
typeList: [],
|
||
},
|
||
workFlowVersionList: [
|
||
{
|
||
versionName: '',
|
||
hideGenInfo: 0, // 是否隐藏图片生成信息
|
||
versionDescription: '', // 富文本
|
||
filePath: '', // 文件路径
|
||
fileName: '', // 文件名
|
||
delFlag: '0', // 是否删除 0存在 2删除
|
||
imagePaths: [],
|
||
},
|
||
],
|
||
}
|
||
}
|
||
else {
|
||
// type参数 1翻译
|
||
try {
|
||
const res = await request.get(`/WorkFlow/selectWorkFlowVersionById?id=${id}`)
|
||
formData.value = res.data
|
||
if (formData.value.workFlow.type) {
|
||
formData.value.workFlow.typeList = formData.value.workFlow.type.split(',')
|
||
}
|
||
else {
|
||
formData.value.workFlow.typeList = []
|
||
}
|
||
if (formData.value.workFlow.activityParticipation) {
|
||
formData.value.workFlow.activityParticipation = Number(formData.value.workFlow.activityParticipation)
|
||
}
|
||
for (let i = 0; i < formData.value.workFlowVersionList.length; i++) {
|
||
if (formData.value.workFlowVersionList[i].imagePaths) {
|
||
formData.value.workFlowVersionList[i].imagePaths = formData.value.workFlowVersionList[i].imagePaths.split(',')
|
||
}
|
||
}
|
||
// else {
|
||
// formData.value.workFlow.activityParticipationList = []
|
||
// }
|
||
}
|
||
catch (error) {
|
||
console.log(error)
|
||
}
|
||
}
|
||
}
|
||
initFormData()
|
||
const EditVersionRef = ref()
|
||
const currentStep = ref(1)
|
||
|
||
function handleAddVersion() {
|
||
EditVersionRef.value.addVersion()
|
||
}
|
||
function nextStep() {
|
||
currentStep.value += 1
|
||
}
|
||
function preStep() {
|
||
currentStep.value -= 1
|
||
}
|
||
const timeLineList = ref([
|
||
{
|
||
name: '创建模版',
|
||
index: 1,
|
||
},
|
||
{
|
||
name: '编辑版本',
|
||
index: 2,
|
||
},
|
||
{
|
||
name: '上传图片',
|
||
index: 3,
|
||
},
|
||
])
|
||
</script>
|
||
|
||
<template>
|
||
<div class="mx-auto py-6">
|
||
<div class="mx-auto flex justify-center">
|
||
<div class="form-container mx-auto">
|
||
<div class="flex items-center justify-between">
|
||
<div class="w-[60%]">
|
||
<TimeLine :time-line-list="timeLineList" :current-step="currentStep" />
|
||
</div>
|
||
<div v-if="currentStep === 2" class="cursor-pointer flex items-center justify-center rounded-full border border-solid border-[#000] px-4 py-1" @click="handleAddVersion">
|
||
<CirclePlus class="mr-2" />
|
||
添加版本
|
||
</div>
|
||
</div>
|
||
|
||
<NConfigProvider>
|
||
<NMessageProvider>
|
||
<div v-if="currentStep === 1" class="first-step mx-auto">
|
||
<EditWorkFlow v-model="formData" @next-step="nextStep" />
|
||
</div>
|
||
<div v-if="currentStep === 2" class="second-step">
|
||
<EditVersion ref="EditVersionRef" v-model="formData" @pre-step="preStep" @next-step="nextStep" />
|
||
</div>
|
||
|
||
<div v-if="currentStep === 3" class="third-step">
|
||
<UploadImg v-model="formData" @pre-step="preStep" />
|
||
</div>
|
||
</NMessageProvider>
|
||
</NConfigProvider>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</template>
|