mcwl-pc/app/pages/publish-model/index.vue

216 lines
8.3 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<script setup lang="ts">
import type { FormInst, FormItemRule } from 'naive-ui'
import CreateModels from '@/components/publishModel/CreateModels.vue'
import EditVersion from '@/components/publishModel/EditVersion.vue'
const step2Ref = ref(null)
const currentStep = ref(2)
const formData = ref({
modelProduct: {
modelName: '模型名称',
modelType: null, // ,,模型类型
category: null, // 垂类分类
functions: null, // '模型功能',
tags: null, // 标签最多三个切割string
activityId: null, // 参与活动string
isOriginal: 1,
originalAuthorName: '',
},
modelVersionList: [
{
versionName: '', // 版本名称
modelId: null, // 基础模型
versionDescription: '"<p>这是一个描述</p><p><img src=\"https://img1.baidu.com/it/u=3001150338,397170470&fm=253&fmt=auto&app=138&f=JPEG?w=800&h=1422\" /></p><p>这是两张图片之间的一些文字说明</p><p><img src=\"https://img12.iqilu.com/10339/clue/202405/29/68ec17f5-9621-461f-ad22-a6820a3f9cf5.jpg\" /></p>"', // 版本描述
filePath: 'https://ybl2112.oss-cn-beijing.aliyuncs.com/2025/JANUARY/2/19/4/877e449c-3c0d-4630-a304-91ec110499f2.png', // 文件路径
fileName: '这是一个文件名文件名。。。。这是一个文件名文件这是一个文件名文件这是一个文件名文件这是一个文件名文件', // 文档里没有 ,表里没有
sampleImagePaths: 'https://ybl2112.oss-cn-beijing.aliyuncs.com/2025/JANUARY/2/19/4/877e449c-3c0d-4630-a304-91ec110499f2.png,https://ybl2112.oss-cn-beijing.aliyuncs.com/2025/JANUARY/2/19/4/877e449c-3c0d-4630-a304-91ec110499f2.png,https://ybl2112.oss-cn-beijing.aliyuncs.com/2025/JANUARY/2/19/4/877e449c-3c0d-4630-a304-91ec110499f2.png', // 第三部的图片路径最多20张,切割
triggerWords: '触发词', // 触发词
isPublic: 1, // 权限是否公开权限 1公开 2自见
isFree: 0, // 0免费
allowFusion: 1, // 待确定
isOnlineUse: 0, // 是否允许在线使用
allowDownloadImage: 1, // 允许下载生图
allowUsage: 1, // 是否允许使用
allowSoftwareUse: 1, // 允许在软件旗下使用
allowCommercialUse: 1, // 是否允许商用
// 允许模型转售或者融合手出售字段没找到?
isExclusiveModel: 0, // 是否为独家模型这个字段
},
],
})
async function addWorkflow() {
try {
const params = {
modelProduct: {
modelName: '模型名称',
modelTypeId: 1, // ,,模型类型
category: '1', // 垂类分类
functions: '1', // '模型功能',
tags: '11', // 标签最多三个切割string
activityId: '1', // 参与活动string
isOriginal: 1, // ??? 0原创1非原创
originalAuthorName: '作者名称',
},
modelVersionList: [
{
versionName: '1.0', // 版本名称
modelId: 1, // 基础模型
versionDescription: '"<p>这是一个描述</p><p><img src=\"https://img1.baidu.com/it/u=3001150338,397170470&fm=253&fmt=auto&app=138&f=JPEG?w=800&h=1422\" /></p><p>这是两张图片之间的一些文字说明</p><p><img src=\"https://img12.iqilu.com/10339/clue/202405/29/68ec17f5-9621-461f-ad22-a6820a3f9cf5.jpg\" /></p>"', // 版本描述
filePath: 'https://ybl2112.oss-cn-beijing.aliyuncs.com/2025/JANUARY/2/19/4/877e449c-3c0d-4630-a304-91ec110499f2.png', // 文件路径
fileName: '', // 文档里没有 ,表里没有
sampleImagePaths: 'https://ybl2112.oss-cn-beijing.aliyuncs.com/2025/JANUARY/2/19/4/877e449c-3c0d-4630-a304-91ec110499f2.png,https://ybl2112.oss-cn-beijing.aliyuncs.com/2025/JANUARY/2/19/4/877e449c-3c0d-4630-a304-91ec110499f2.png,https://ybl2112.oss-cn-beijing.aliyuncs.com/2025/JANUARY/2/19/4/877e449c-3c0d-4630-a304-91ec110499f2.png', // 第三部的图片路径最多20张,切割
triggerWords: '触发词', // 触发词
isPublic: 1, // 权限是否公开权限 1公开 2自见
allowFusion: 1, // 待确定
isFree: 0, // 0免费
allowDownloadImage: 1, // 允许下载生图
allowUsage: 1, // 是否允许使用
allowSoftwareUse: 1, // 允许在软件旗下使用
allowCommercialUse: 1, // 是否允许商用
// 允许模型转售或者融合手出售字段没找到?
isExclusiveModel: 1, // 是否为独家模型这个字段
},
],
}
const res = await request.post('/model/insert', params)
}
catch (error) {
console.log(error)
}
}
function createModelsNext() {
currentStep.value = 2
}
function handleAddVersion() {
if (step2Ref.value) {
step2Ref.value?.addVersion()
}
}
// const handleValidateButtonClick = (e: MouseEvent) => {
// e.preventDefault();
// formRef.value?.validate((errors) => {
// if (!errors) {
// message.success("验证成功");
// } else {
// console.log(errors);
// message.error("验证失败");
// }
// });
// };
</script>
<template>
<div class="mx-auto py-6">
<div class="container mx-auto w-[700px]">
<div class="step-line flex">
<div class="mr-10">
1创建模版
</div>
<div class="mr-10">
2编辑版本
</div>
<div class="mr-10">
3上传图片
</div>
<div v-if="currentStep === 2" @click="handleAddVersion">
添加版本
</div>
</div>
<div class="form-container">
<div v-if="currentStep === 1" class="first-step">
<CreateModels v-model="formData" @create-models-next="createModelsNext" />
</div>
<div v-if="currentStep === 2" class="second-step">
<EditVersion ref="step2Ref" v-model="formData" />
</div>
<div v-if="currentStep === 3" class="third-step">
3
</div>
</div>
<!-- <div class="flex items-center justify-center mt-4">
<div>
<div class="flex justify-center items-center mt-5 text-white w-30 h-10 rounded-lg bg-[#3162ff] cursor-pointer" @click="nextStep">
下一步
</div>
</div>
</div> -->
</div>
<!-- <n-form
ref="formRef"
:model="formData"
:rules="rules"
label-placement="left"
label-width="auto"
require-mark-placement="right-hanging"
size="large"
:style="{
maxWidth: '640px',
}"
>
<n-form-item label="模型名称" path="inputValue">
<n-input v-model:value="formData.inputValue" placeholder="Input" />
</n-form-item>
<n-form-item label="模型类型" path="inputValue">
<n-select v-model:value="formData.value" :options="cuileioptions" />
</n-form-item>
<n-form-item label="Checkbox Group" path="checkboxGroupValue">
<n-checkbox-group v-model:value="formData.checkboxGroupValue">
<n-space>
<n-checkbox value="Option 1">
Option 1
</n-checkbox>
<n-checkbox value="Option 2">
Option 2
</n-checkbox>
<n-checkbox value="Option 3">
Option 3
</n-checkbox>
</n-space>
</n-checkbox-group>
</n-form-item>
<n-form-item label="Radio Group" path="radioGroupValue">
<n-radio-group v-model:value="formData.radioGroupValue" name="radiogroup1">
<n-space>
<n-radio value="Radio 1">
Radio 1
</n-radio>
<n-radio value="Radio 2">
Radio 2
</n-radio>
<n-radio value="Radio 3">
Radio 3
</n-radio>
</n-space>
</n-radio-group>
</n-form-item>
<n-form-item label="Radio Button Group" path="radioGroupValue">
<n-radio-group v-model:value="formData.radioGroupValue" name="radiogroup2">
<n-radio-button value="Radio 1">
Radio 1
</n-radio-button>
<n-radio-button value="Radio 2">
Radio 2
</n-radio-button>
<n-radio-button value="Radio 3">
Radio 3
</n-radio-button>
</n-radio-group>
</n-form-item>
<div style="display: flex; justify-content: flex-end">
<n-button round type="primary" @click="addWorkflow">
</n-button>
</div>
</n-form> -->
</div>
<!-- <pre
>{{ JSON.stringify(model, null, 2) }}
</pre> -->
</template>