|
@@ -10,6 +10,11 @@
|
|
|
</div> -->
|
|
|
<div class="form-content">
|
|
|
<el-form label-position="top">
|
|
|
+ <el-form-item clearable label="品类">
|
|
|
+ <el-radio-group v-model="formData.product" @change="getTypeName()">
|
|
|
+ <el-radio-button v-for="item in typeGroup" :label="item.value" :key="item.value">{{ item.label }}</el-radio-button>
|
|
|
+ </el-radio-group>
|
|
|
+ </el-form-item>
|
|
|
<el-form-item clearable label="自定义关键词">
|
|
|
<el-input
|
|
|
type="textarea"
|
|
@@ -17,17 +22,19 @@
|
|
|
:rows="5"
|
|
|
show-word-limit
|
|
|
maxlength="2000"
|
|
|
+ placeholder="示范:手持吸尘器、翡翠吊坠"
|
|
|
v-model="formData.description" />
|
|
|
</el-form-item>
|
|
|
<el-form-item label="类别">
|
|
|
- <el-select class="wid100" v-model="formData.category" filterable clearable multiple placeholder="请选择">
|
|
|
+ <el-select class="wid100" style="width:200px" v-model="formData.category" filterable clearable :multiple="formData.product == 'jewelry'" placeholder="请选择">
|
|
|
<el-option
|
|
|
- v-for="item in typeList"
|
|
|
+ v-for="item in categoryList"
|
|
|
:key="item.value"
|
|
|
:label="item.label"
|
|
|
:value="item.value" />
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
+ <template v-if="formData.product == 'jewelry'">
|
|
|
<el-row :gutter="20">
|
|
|
<el-col :span="8">
|
|
|
<el-form-item label="适用场景">
|
|
@@ -110,55 +117,52 @@
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
- <!-- <el-col :span="12">
|
|
|
- <el-form-item label="自定义风格">
|
|
|
- <el-upload
|
|
|
- v-model:file-list="fileList"
|
|
|
- class="upload-demo"
|
|
|
- action="https://run.mocky.io/v3/9d059bf9-4660-45f2-925d-ce80ad6c4d15"
|
|
|
- multiple
|
|
|
- :on-preview="handlePreview"
|
|
|
- :on-remove="handleRemove"
|
|
|
- :before-remove="beforeRemove"
|
|
|
- :limit="3"
|
|
|
- :on-exceed="handleExceed"
|
|
|
- >
|
|
|
- <el-button type="primary">Click to upload</el-button>
|
|
|
- </el-upload>
|
|
|
- </el-form-item>
|
|
|
- </el-col> -->
|
|
|
</el-row>
|
|
|
+ </template>
|
|
|
</el-form>
|
|
|
</div>
|
|
|
<div class="head-title">
|
|
|
<h3 class="title">图片设置</h3>
|
|
|
</div>
|
|
|
<div class="image-setting">
|
|
|
- <!-- <div class="sub-title sub-title_style">
|
|
|
+ <div class="sub-title sub-title_style">
|
|
|
<span>图片尺寸</span>
|
|
|
- </div> -->
|
|
|
- <!-- <el-row :gutter="20">
|
|
|
+ </div>
|
|
|
+ <el-row :gutter="20">
|
|
|
<el-col :span="6" v-for="item in imageScaleList" :key="item.size">
|
|
|
<div class="scale-item center-center" :class="{active: formData.sizeStyle === item.value}" @click="onGetScalc(item)">
|
|
|
<div>
|
|
|
<div class="scale">{{ item.size }}</div>
|
|
|
- <div class="scale scale-name">{{ item.label }}</div>
|
|
|
+ <!-- <div class="scale scale-name">{{ item.label }}</div> -->
|
|
|
</div>
|
|
|
</div>
|
|
|
</el-col>
|
|
|
- </el-row> -->
|
|
|
- <div class="sub-title sub-title_style">
|
|
|
+ </el-row>
|
|
|
+ <!-- <div class="sub-title sub-title_style">
|
|
|
<span>图片尺寸</span>
|
|
|
+ </div> -->
|
|
|
+ <!-- <el-row :gutter="20">
|
|
|
+ <el-col :span="6" v-for="item in sizeGroup" :key="item.label">
|
|
|
+ <div class="scale-item center-center" :class="{'active' : formData.size === item.value}" @click="onGetSize(item)">
|
|
|
+ <div>
|
|
|
+ <div class="scale">{{ item.label }}</div>
|
|
|
+ <div class="scale-text">{{ item.name }}</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ </el-row> -->
|
|
|
+ <!-- <div class="sub-title sub-title_style">
|
|
|
+ <span>图片分辩率</span>
|
|
|
</div>
|
|
|
<el-row :gutter="20">
|
|
|
- <el-col :span="6" v-for="item in imageSizeList" :key="item.label">
|
|
|
- <div class="scale-item center-center" :class="{'active' : formData.size === item.value}" @click="onGetSize(item)">
|
|
|
+ <el-col :span="6" v-for="item in rainGroup" :key="item.label">
|
|
|
+ <div class="scale-item center-center" :class="{'active' : formData.size === item.value}" @click="onSetRatin(item)">
|
|
|
<div>
|
|
|
<div class="scale">{{ item.label }}</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</el-col>
|
|
|
- </el-row>
|
|
|
+ </el-row> -->
|
|
|
<div class="silder-item">
|
|
|
<div class="sub-title sub-title_style">
|
|
|
<span>创意度</span>
|
|
@@ -180,9 +184,9 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div class="silder-item">
|
|
|
+ <!-- <div class="silder-item">
|
|
|
<div class="tips">今日剩余额度 <b>{{ state.user.quota }}</b></div>
|
|
|
- </div>
|
|
|
+ </div> -->
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="s-footer center-center">
|
|
@@ -207,7 +211,13 @@ import {
|
|
|
styleColorList,
|
|
|
mosaicMaterial,
|
|
|
imageScaleList,
|
|
|
- imageSizeList
|
|
|
+ imageSizeList,
|
|
|
+ typeGroup,
|
|
|
+ refrigerator, // 冰箱
|
|
|
+ electricRiceCooker, // 电饭煲
|
|
|
+ vacuumCleaner, // 吸尘器
|
|
|
+ rechargeableToothbrush, //电动牙刷
|
|
|
+ laptopComputer, // 笔记本电脑
|
|
|
} from '@/utils/formEnum'
|
|
|
import { postCreatTask } from '@/network/api/user'
|
|
|
const internalInstance = getCurrentInstance()
|
|
@@ -218,7 +228,14 @@ const props = defineProps({
|
|
|
let { state, dispatch } = useStore()
|
|
|
|
|
|
let loading = ref(false)
|
|
|
-let formData = reactive({
|
|
|
+const rainGroup = ref([
|
|
|
+ { label: '2048:2048', value: 1 },
|
|
|
+ { label: '4096:4096', value: 2 },
|
|
|
+ { label: '1636:1536', value: 3 },
|
|
|
+])
|
|
|
+let categoryList = ref([])
|
|
|
+let formData = ref({
|
|
|
+ product: '',
|
|
|
description: '',
|
|
|
category: [],
|
|
|
scene: '',
|
|
@@ -232,18 +249,46 @@ let formData = reactive({
|
|
|
size: 1,
|
|
|
creativity: 7
|
|
|
})
|
|
|
+function getTypeName() {
|
|
|
+ let type = formData.value.product
|
|
|
+ formData.value.category = ''
|
|
|
+ setData(type)
|
|
|
+}
|
|
|
+function setData(type) {
|
|
|
+ if (type === 'jewelry') { // 珠宝
|
|
|
+ categoryList.value = typeList
|
|
|
+ } else if (type === 'electricRiceCooker') { // 电饭煲
|
|
|
+ categoryList.value = electricRiceCooker
|
|
|
+ } else if (type === 'refrigerator') { // 冰箱
|
|
|
+ categoryList.value = refrigerator
|
|
|
+ } else if (type === 'electricToothbrush') { // 充电牙刷
|
|
|
+ categoryList.value = rechargeableToothbrush
|
|
|
+ } else if (type === 'dustCollector') { // 吸尘器
|
|
|
+ categoryList.value = vacuumCleaner
|
|
|
+ } else if (type === 'notebookComputer') { // 笔记本电脑
|
|
|
+ categoryList.value = laptopComputer
|
|
|
+ } else {
|
|
|
+ categoryList.value = []
|
|
|
+ }
|
|
|
+}
|
|
|
function onGetScalc (item) {
|
|
|
- formData.sizeStyle = item.value
|
|
|
+ formData.value.sizeStyle = item.value
|
|
|
internalInstance.ctx.$forceUpdate()
|
|
|
}
|
|
|
function onGetSize (item) {
|
|
|
formData.size = item.value
|
|
|
internalInstance.ctx.$forceUpdate()
|
|
|
}
|
|
|
+function onSetRatin (item) {
|
|
|
+ formData.value.size = item.value
|
|
|
+ internalInstance.ctx.$forceUpdate()
|
|
|
+}
|
|
|
// 创建任务
|
|
|
const creatTask = async () => {
|
|
|
- const { description, category, scene, workmanship, pattern, modeling, mainMaterial, studdedMaterial, style, sizeStyle, size, creativity } = formData
|
|
|
- const param = {
|
|
|
+ // console.log(formData.value)
|
|
|
+ const { description, category, scene, workmanship, pattern, modeling, mainMaterial, studdedMaterial, style, sizeStyle, size, creativity, product } = formData.value
|
|
|
+ let param = {
|
|
|
+ product,
|
|
|
description,
|
|
|
category,
|
|
|
scene,
|
|
@@ -257,6 +302,9 @@ const creatTask = async () => {
|
|
|
size,
|
|
|
creativity
|
|
|
}
|
|
|
+ if (product != 'jewelry') {
|
|
|
+ param.category = [category]
|
|
|
+ }
|
|
|
loading.value = true
|
|
|
try {
|
|
|
const res = await postCreatTask(param)
|
|
@@ -273,7 +321,11 @@ const creatTask = async () => {
|
|
|
// const isPage = ref(false)
|
|
|
watch(() => props.taskDetail, (newVal) => {
|
|
|
if (newVal) {
|
|
|
- Object.assign(formData, newVal.task)
|
|
|
+ setData(newVal.task.product)
|
|
|
+ Object.assign(formData.value, newVal.task)
|
|
|
+ if (newVal.task.product != 'jewelry') {
|
|
|
+ formData.value.category = newVal.task.category.join('')
|
|
|
+ }
|
|
|
}
|
|
|
},
|
|
|
{ deep: true }
|
|
@@ -281,7 +333,7 @@ watch(() => props.taskDetail, (newVal) => {
|
|
|
onMounted(() => {
|
|
|
if (JSON.stringify(props.taskDetail.task) != '{}') {
|
|
|
// console.log(JSON.stringify(props.taskDetail.task) == {})
|
|
|
- formData = props.taskDetail.task
|
|
|
+ formData.value = props.taskDetail.task
|
|
|
}
|
|
|
})
|
|
|
</script>
|
|
@@ -308,6 +360,11 @@ onMounted(() => {
|
|
|
border-radius: 10px;
|
|
|
border-width: 2px;
|
|
|
text-align: center;
|
|
|
+ .scale-text {
|
|
|
+ font-size: 12px;
|
|
|
+ line-height: 20px;
|
|
|
+ color: var(--page-textsub-color);
|
|
|
+ }
|
|
|
|
|
|
&:hover {
|
|
|
cursor: pointer;
|