<template>
|
<ContentScrollView :paddingH="false">
|
<nut-form :model-value="form" ref="formRef">
|
<nut-form-item label="身高:" class="bole-form-item" prop="height">
|
<NumberInput v-model="form.height" placeholder="请输入">
|
<template #right>cm</template>
|
</NumberInput>
|
</nut-form-item>
|
<nut-form-item label="体重:" class="bole-form-item" prop="weight">
|
<NumberInput v-model="form.weight" placeholder="请输入">
|
<template #right>kg</template>
|
</NumberInput>
|
</nut-form-item>
|
<nut-form-item label="鞋码:" class="bole-form-item" prop="shoeSize">
|
<NumberInput v-model="form.shoeSize" :min="0" :max="100" placeholder="请输入">
|
<template #right>码</template>
|
</NumberInput>
|
</nut-form-item>
|
<nut-form-item
|
label="个人生活照（单张照片不超过5m，最多不超过6张）:"
|
class="bole-form-item person-photo"
|
prop="photos"
|
label-position="top"
|
>
|
<Uploader v-model:file-list="form.photos" :maximum="6" class="bole-uploader"> </Uploader>
|
</nut-form-item>
|
<nut-form-item
|
label="个人视频:"
|
class="bole-form-item person-photo"
|
prop="videos"
|
label-position="top"
|
>
|
<Uploader
|
v-model:file-list="form.videos"
|
:maximum="1"
|
class="bole-uploader"
|
:media-type="['video']"
|
>
|
<template #item="{ item }">
|
<video class="editor-video" :src="item.url" />
|
</template>
|
<template #upload-icon>
|
<UploaderIcon color="#808080" />
|
</template>
|
</Uploader>
|
<div class="video-demo">
|
<div class="video-demo-title">视频模板</div>
|
<video class="editor-video" :src="OssAssets.mine.UseResumeVideo" />
|
</div>
|
</nut-form-item>
|
</nut-form>
|
</ContentScrollView>
|
<PageFooter>
|
<PageFooterBtn type="primary" @click="handleConfirm">保存</PageFooterBtn>
|
</PageFooter>
|
</template>
|
|
<script setup lang="ts">
|
import { goBack } from '@/utils';
|
import { NumberInput } from '@12333/components';
|
import { useUpdateResume } from '@12333/hooks';
|
import * as userResumeServices from '@12333/services/apiV2/userResume';
|
import { convertApiPath2Url, convertFormUrl2Api, Message } from '@12333/utils';
|
import { FileItem } from '@nutui/nutui-taro/dist/types/__VUE/uploader/type';
|
import { useQuery } from '@tanstack/vue-query';
|
import { Uploader as UploaderIcon } from '@nutui/icons-vue-taro';
|
import { OssAssets } from '@/constants';
|
import { FormRules } from '@nutui/nutui-taro/dist/types/__VUE/form/types';
|
|
defineOptions({
|
name: 'InnerPage',
|
});
|
|
const { updateUserResume } = useUpdateResume();
|
|
const {
|
isLoading,
|
isError,
|
data: detail,
|
refetch,
|
} = useQuery({
|
queryKey: ['userResumeServices/getUserResumeDetail'],
|
queryFn: async () => {
|
return await userResumeServices.getUserResumeDetail(
|
{},
|
{
|
showLoading: false,
|
}
|
);
|
},
|
placeholderData: () => ({} as API.GetUserResumeDetailQueryResult),
|
onSuccess(data) {
|
form.height = data.height;
|
form.weight = data.weight;
|
form.shoeSize = data.shoeSize;
|
form.photos = data.photos?.length ? data.photos.map(convertApiPath2Url) : [];
|
form.videos = data.videos?.length ? data.videos.map(convertApiPath2Url) : [];
|
},
|
});
|
|
const form = reactive({
|
height: 0,
|
weight: 0,
|
shoeSize: 0,
|
photos: [] as FileItem[],
|
videos: [] as FileItem[],
|
});
|
|
const rules = reactive<FormRules>({});
|
|
async function handleConfirm() {
|
try {
|
let params: API.SaveUserResumeDetailCommand = {
|
weight: form.weight,
|
height: form.height,
|
shoeSize: form.shoeSize,
|
photos: convertFormUrl2Api(form.photos),
|
videos: convertFormUrl2Api(form.videos),
|
};
|
let res = await userResumeServices.saveUserResumeDetail(params);
|
if (res) {
|
Message.success('保存成功', {
|
onClosed() {
|
goBack();
|
updateUserResume();
|
},
|
});
|
}
|
} catch (error) {}
|
}
|
</script>
|
|
<style lang="scss">
|
@import '@/styles/common.scss';
|
|
.mineDetailedInfo-page-wrapper {
|
.person-photo {
|
.nut-form-item__label {
|
padding-right: 0;
|
}
|
}
|
|
.nut-form .nut-cell.bole-form-item:not(.alignTop),
|
page .nut-form .nut-cell.bole-form-item:not(.alignTop) {
|
align-items: flex-start !important;
|
}
|
|
.editor-video {
|
width: 200px;
|
height: 200px;
|
}
|
|
.video-demo {
|
.video-demo-title {
|
margin: 12px 0;
|
}
|
}
|
}
|
</style>
|
