Merge branch 'dev_vite' of ssh://18.167.251.121:10002/aidlab/aida_front into dev_vite
This commit is contained in:
@@ -1,33 +0,0 @@
|
||||
/** @type {import('prettier').Config} */
|
||||
module.exports = {
|
||||
// 打印宽度
|
||||
printWidth: 100,
|
||||
// 使用 4 空格缩进
|
||||
tabWidth: 4,
|
||||
// 使用 4 空格缩进,不使用制表符
|
||||
useTabs: true,
|
||||
// 行尾使用 LF (Unix 风格)
|
||||
endOfLine: 'lf',
|
||||
// 语句末尾使用分号
|
||||
semi: false,
|
||||
// 使用单引号
|
||||
singleQuote: false,
|
||||
// 对象和数组末尾不添加尾随逗号
|
||||
trailingComma: 'none',
|
||||
// JSX 引号使用单引号
|
||||
jsxSingleQuote: false,
|
||||
// 括号内侧空格
|
||||
bracketSpacing: true,
|
||||
// JSX 标签不换行
|
||||
bracketSameLine: false,
|
||||
// 箭头函数参数始终使用括号
|
||||
arrowParens: 'always',
|
||||
// HTML、Vue、Angular 和 Markdown 使用 LF
|
||||
htmlWhitespaceSensitivity: 'css',
|
||||
// Vue 文件脚本和样式缩进
|
||||
vueIndentScriptAndStyle: false,
|
||||
// 行注释位置在注释上方,不加空格
|
||||
proseWrap: 'preserve',
|
||||
// 根据文件类型自动推断
|
||||
embeddedLanguageFormatting: 'auto',
|
||||
};
|
||||
17
.prettierrc.json
Normal file
17
.prettierrc.json
Normal file
@@ -0,0 +1,17 @@
|
||||
{
|
||||
"printWidth": 100,
|
||||
"tabWidth": 4,
|
||||
"useTabs": true,
|
||||
"endOfLine": "lf",
|
||||
"semi": false,
|
||||
"singleQuote": false,
|
||||
"trailingComma": "none",
|
||||
"jsxSingleQuote": false,
|
||||
"bracketSpacing": true,
|
||||
"bracketSameLine": false,
|
||||
"arrowParens": "always",
|
||||
"htmlWhitespaceSensitivity": "css",
|
||||
"vueIndentScriptAndStyle": true,
|
||||
"proseWrap": "preserve",
|
||||
"embeddedLanguageFormatting": "auto"
|
||||
}
|
||||
@@ -49,8 +49,11 @@ const seller: Module<Seller, RootState> = {
|
||||
},
|
||||
set_designerInfo(state: Seller, value: DesignerInfo) {
|
||||
state.designerInfo = {
|
||||
...state.designerInfo,
|
||||
...value,
|
||||
socialLinks: JSON.parse(value.socialLinks)
|
||||
}
|
||||
if (value.socialLinks) {
|
||||
state.designerInfo.socialLinks = JSON.parse(value.socialLinks)
|
||||
}
|
||||
},
|
||||
},
|
||||
|
||||
@@ -474,6 +474,7 @@ export const Https = {
|
||||
|
||||
|
||||
// 卖家端接口
|
||||
sellerUploadFile: '/seller/file/upload', // 卖家上传文件
|
||||
checkSellerDesigner: '/seller/designer/check', // 检查卖家是否为设计师
|
||||
getSellerApplyStatus: '/seller/designer/apply/status', // 获取卖家申请状态
|
||||
submitSellerApply: '/seller/designer/apply', // 提交卖家申请
|
||||
@@ -483,7 +484,8 @@ export const Https = {
|
||||
getSellerOrderList: '/seller/order/page', // 获取卖家订单列表
|
||||
getListingPopup: '/seller/listing/popup/check', // 获取是否勾选发布作品提示
|
||||
setListingPopup: '/seller/listing/popup/set', // 设置是否勾选发布作品提示
|
||||
|
||||
getListingList: '/seller/listing/page', // 获取商品列表,发布和未发布
|
||||
putListingStatus: '/seller/listing/status', // 更新商品状态
|
||||
},
|
||||
|
||||
axiosGet(url, config, pathParams) {
|
||||
|
||||
@@ -12,7 +12,6 @@
|
||||
centerBox
|
||||
@realTime="onChange"
|
||||
outputType="png"
|
||||
v-bind="bindProps"
|
||||
></VueCropper>
|
||||
</div>
|
||||
<div class="clip_opterate">
|
||||
@@ -35,10 +34,10 @@
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
import { ref, useAttrs, onMounted, onBeforeUnmount, computed, nextTick, watch } from "vue"
|
||||
import "vue-cropper/dist/index.css"
|
||||
import { VueCropper } from "vue-cropper"
|
||||
const props = defineProps({
|
||||
import { ref, useAttrs, onMounted, onBeforeUnmount, computed, nextTick, watch } from "vue"
|
||||
import "vue-cropper/dist/index.css"
|
||||
import { VueCropper } from "vue-cropper"
|
||||
const props = defineProps({
|
||||
url: {
|
||||
type: String,
|
||||
default: ""
|
||||
@@ -51,59 +50,53 @@ const props = defineProps({
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
fixedBox: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
type: {
|
||||
type: String,
|
||||
default: () => ""
|
||||
}
|
||||
})
|
||||
const attrs = useAttrs()
|
||||
})
|
||||
const attrs = useAttrs()
|
||||
|
||||
const autoCropHeight = computed(() => {
|
||||
const autoCropHeight = computed(() => {
|
||||
let height = 426
|
||||
if (props.type === "cover") height = 375
|
||||
else if (props.type === "apparel") height = 320
|
||||
return height
|
||||
})
|
||||
})
|
||||
|
||||
const bindProps = computed(() => {
|
||||
// :autoCropWidth="isProduct ? undefined : type === 'cover' ? 297 : 242"
|
||||
// :autoCropHeight="isProduct ? undefined : autoCropHeight"
|
||||
// if (props.isProduct) {
|
||||
// return {
|
||||
// autoCropHeight: autoCropHeight.value,
|
||||
// autoCropWidth: props.type === "cover" ? 297 : 242
|
||||
// }
|
||||
// }
|
||||
})
|
||||
|
||||
const onChange = (data) => {
|
||||
const onChange = (data) => {
|
||||
if (attrs.onChange) {
|
||||
getCropUrl().then((url) => attrs.onChange(url))
|
||||
}
|
||||
}
|
||||
const cropper = ref(null)
|
||||
const imageClipBody = ref(null)
|
||||
let injectLabelFrame = 0
|
||||
const observer = new ResizeObserver((entries) => {
|
||||
}
|
||||
const cropper = ref(null)
|
||||
const imageClipBody = ref(null)
|
||||
let injectLabelFrame = 0
|
||||
const observer = new ResizeObserver((entries) => {
|
||||
refreshCrop()
|
||||
})
|
||||
})
|
||||
|
||||
const clearCropLabels = (cropperBox) => {
|
||||
const clearCropLabels = (cropperBox) => {
|
||||
if (!cropperBox) return
|
||||
cropperBox.querySelectorAll(".cropper-line-label").forEach((node) => node.remove())
|
||||
}
|
||||
}
|
||||
|
||||
const createCropLabel = ({ text, top, className }) => {
|
||||
const createCropLabel = ({ text, top, className }) => {
|
||||
const label = document.createElement("div")
|
||||
label.className = `cropper-line-label ${className}`
|
||||
label.textContent = text
|
||||
label.style.top = top
|
||||
label.style.left = className === "label-v" ? "50%" : "0"
|
||||
label.style.transform = className === "label-v" ? "translate(-50%, -50%)" : "translateY(-50%)"
|
||||
label.style.transform =
|
||||
className === "label-v" ? "translate(-50%, -50%)" : "translateY(-50%)"
|
||||
return label
|
||||
}
|
||||
}
|
||||
|
||||
const cropLabelMap = {
|
||||
const cropLabelMap = {
|
||||
cover: [
|
||||
{ text: "crown", top: "2.67%", className: "label-h" },
|
||||
{ text: "hip line", top: "63.47%", className: "label-h" },
|
||||
@@ -121,9 +114,9 @@ const cropLabelMap = {
|
||||
{ text: "center", top: "0", className: "label-v" }
|
||||
],
|
||||
apparel: [{ text: "center", top: "0", className: "label-v" }]
|
||||
}
|
||||
}
|
||||
|
||||
const injectCropLabel = () => {
|
||||
const injectCropLabel = () => {
|
||||
const cropperBox = imageClipBody.value?.querySelector(".cropper-view-box")
|
||||
|
||||
if (!cropperBox) return false
|
||||
@@ -134,64 +127,64 @@ const injectCropLabel = () => {
|
||||
})
|
||||
|
||||
return true
|
||||
}
|
||||
}
|
||||
|
||||
const scheduleInjectCropLabel = (retry = 0) => {
|
||||
const scheduleInjectCropLabel = (retry = 0) => {
|
||||
cancelAnimationFrame(injectLabelFrame)
|
||||
injectLabelFrame = requestAnimationFrame(() => {
|
||||
if (!injectCropLabel() && retry < 10) {
|
||||
scheduleInjectCropLabel(retry + 1)
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
onMounted(() => {
|
||||
observer.observe(imageClipBody.value)
|
||||
scheduleInjectCropLabel()
|
||||
})
|
||||
onBeforeUnmount(() => {
|
||||
})
|
||||
onBeforeUnmount(() => {
|
||||
observer.disconnect()
|
||||
cancelAnimationFrame(injectLabelFrame)
|
||||
})
|
||||
const rotateLeft = () => {
|
||||
})
|
||||
const rotateLeft = () => {
|
||||
cropper.value.rotateLeft()
|
||||
}
|
||||
const rotateRight = () => {
|
||||
}
|
||||
const rotateRight = () => {
|
||||
cropper.value.rotateRight()
|
||||
}
|
||||
const refreshCrop = () => {
|
||||
}
|
||||
const refreshCrop = () => {
|
||||
cropper.value.refresh()
|
||||
}
|
||||
const changeScale = (num = 1) => {
|
||||
}
|
||||
const changeScale = (num = 1) => {
|
||||
cropper.value.changeScale(num)
|
||||
}
|
||||
const getCropUrl = () => {
|
||||
}
|
||||
const getCropUrl = () => {
|
||||
return new Promise((resolve, reject) => {
|
||||
cropper.value.getCropData(resolve)
|
||||
})
|
||||
}
|
||||
const getCropBlob = () => {
|
||||
}
|
||||
const getCropBlob = () => {
|
||||
return new Promise((resolve, reject) => {
|
||||
cropper.value.getCropBlob(resolve)
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
watch(
|
||||
watch(
|
||||
[() => props.type, () => props.url],
|
||||
async () => {
|
||||
await nextTick()
|
||||
scheduleInjectCropLabel()
|
||||
},
|
||||
{ flush: "post" }
|
||||
)
|
||||
)
|
||||
|
||||
defineExpose({
|
||||
defineExpose({
|
||||
getCropUrl,
|
||||
getCropBlob
|
||||
})
|
||||
})
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.image-clip {
|
||||
.image-clip {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
@@ -357,11 +350,11 @@ defineExpose({
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
<style lang="less">
|
||||
.cropper-line-label {
|
||||
.cropper-line-label {
|
||||
position: absolute;
|
||||
color: #4ba5ff; /* 统一颜色 */
|
||||
font-size: 11px;
|
||||
@@ -373,19 +366,19 @@ defineExpose({
|
||||
pointer-events: none;
|
||||
z-index: 10;
|
||||
line-height: 1.2;
|
||||
}
|
||||
}
|
||||
|
||||
/* 水平线名称:放在线段上方 2px */
|
||||
.label-h {
|
||||
/* 水平线名称:放在线段上方 2px */
|
||||
.label-h {
|
||||
transform: translateY(-100%);
|
||||
margin-top: -2px;
|
||||
left: 4px;
|
||||
}
|
||||
}
|
||||
|
||||
/* 垂直线名称:放在裁剪框顶部边缘上方 */
|
||||
.label-v {
|
||||
/* 垂直线名称:放在裁剪框顶部边缘上方 */
|
||||
.label-v {
|
||||
transform: translateX(-50%);
|
||||
top: -20px;
|
||||
left: 50%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -25,8 +25,8 @@
|
||||
<div class="and-profile-footer">
|
||||
<template v-if="isEdit">
|
||||
<div class="btns">
|
||||
<button class="cancel" @click="onCancel">Cancel</button>
|
||||
<button class="submit" @click="onSubmit">Save Change</button>
|
||||
<button class="cancel" @click="onCancel()">Cancel</button>
|
||||
<button class="submit" @click="onSubmit()">Save Change</button>
|
||||
</div>
|
||||
<p class="tip">Changes will be reflected on your Stylish Parade brand page.</p>
|
||||
</template>
|
||||
@@ -47,6 +47,7 @@
|
||||
import ImageClipDialog from "./image-clip-dialog.vue"
|
||||
import { useStore } from "vuex"
|
||||
const store = useStore()
|
||||
store.dispatch("seller/get_designerInfo")
|
||||
const designerInfo = computed(() => store.state.seller.designerInfo)
|
||||
const avatar = computed(() => designerInfo.value.avatar)
|
||||
const banner = computed(() => designerInfo.value.brandBanner)
|
||||
@@ -69,13 +70,25 @@
|
||||
input.click()
|
||||
}
|
||||
|
||||
const uploadFile = async (file) => {
|
||||
const formData = new FormData()
|
||||
formData.append("file", file)
|
||||
return Https.axiosPost(Https.httpUrls.sellerUploadFile, formData, {
|
||||
headers: {
|
||||
"Content-Type": "multipart/form-data"
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
const onChangeBanner = () => {
|
||||
uploadImg(({ url }) => {
|
||||
imageClipDialogRef.value.open(
|
||||
url,
|
||||
(file) => {
|
||||
// banner.value = URL.createObjectURL(file)
|
||||
console.log(URL.createObjectURL(file))
|
||||
async (file) => {
|
||||
store.commit("set_loading", true)
|
||||
const res = await uploadFile(file)
|
||||
onSubmit({ brandBanner: res })
|
||||
store.commit("set_loading", false)
|
||||
},
|
||||
{ ratio: [40, 7], isPreview: false, title: "Crop Brand Banner" }
|
||||
)
|
||||
@@ -85,9 +98,11 @@
|
||||
uploadImg(({ url }) => {
|
||||
imageClipDialogRef.value.open(
|
||||
url,
|
||||
(file) => {
|
||||
// avatar.value = URL.createObjectURL(file)
|
||||
console.log(URL.createObjectURL(file))
|
||||
async (file) => {
|
||||
store.commit("set_loading", true)
|
||||
const res = await uploadFile(file)
|
||||
onSubmit({ avatar: res })
|
||||
store.commit("set_loading", false)
|
||||
},
|
||||
{ ratio: [1, 1], isPreview: true, title: "Crop Avatar" }
|
||||
)
|
||||
@@ -99,12 +114,16 @@
|
||||
const onCancel = () => {
|
||||
isEdit.value = false
|
||||
}
|
||||
const onSubmit = async () => {
|
||||
const res = await brandInfoRef.value.submit()
|
||||
const onSubmit = async (value = null) => {
|
||||
const res = value ? value : await brandInfoRef.value.submit()
|
||||
const data = {
|
||||
...designerInfo.value,
|
||||
...res,
|
||||
socialLinks: JSON.stringify(res.socialLinks)
|
||||
...res
|
||||
}
|
||||
try {
|
||||
data.socialLinks = JSON.stringify(data.socialLinks)
|
||||
} catch (error) {
|
||||
data.socialLinks = JSON.stringify([])
|
||||
}
|
||||
Https.axiosPut(Https.httpUrls.updateDesignerInfo, data).then((res) => {
|
||||
isEdit.value = false
|
||||
@@ -123,6 +142,7 @@
|
||||
margin-bottom: 6rem;
|
||||
> .bg {
|
||||
position: relative;
|
||||
min-height: 15rem;
|
||||
> img {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
|
||||
@@ -20,38 +20,38 @@
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { computed } from "vue"
|
||||
import { computed } from "vue"
|
||||
|
||||
interface Option {
|
||||
interface Option {
|
||||
name: string | number
|
||||
value: string | number | boolean
|
||||
key: string
|
||||
optype: boolean
|
||||
}
|
||||
}
|
||||
|
||||
const props = defineProps<{
|
||||
const props = defineProps<{
|
||||
modelValue: string | number | boolean | Array<string | number | boolean> | null
|
||||
options: Option[] // 按钮选项数组
|
||||
multiple?: boolean // 是否支持多选,默认为 false
|
||||
}>()
|
||||
}>()
|
||||
|
||||
const emit = defineEmits<{
|
||||
const emit = defineEmits<{
|
||||
(e: "update:modelValue", value: any): void
|
||||
}>()
|
||||
}>()
|
||||
|
||||
const multiple = props.multiple === true
|
||||
const multiple = props.multiple === true
|
||||
|
||||
const selectedValues = computed(() => {
|
||||
const selectedValues = computed(() => {
|
||||
if (!multiple) {
|
||||
return typeof props.modelValue === 'undefined' || props.modelValue === null
|
||||
return typeof props.modelValue === "undefined" || props.modelValue === null
|
||||
? []
|
||||
: [props.modelValue]
|
||||
}
|
||||
|
||||
return Array.isArray(props.modelValue) ? props.modelValue : []
|
||||
})
|
||||
})
|
||||
|
||||
const selectOption = (value: any) => {
|
||||
const selectOption = (value: any) => {
|
||||
if (multiple) {
|
||||
const current = Array.isArray(props.modelValue) ? [...props.modelValue] : []
|
||||
const index = current.indexOf(value)
|
||||
@@ -67,17 +67,17 @@ const selectOption = (value: any) => {
|
||||
if (props.modelValue !== value) {
|
||||
emit("update:modelValue", value)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.radio-button-group {
|
||||
.radio-button-group {
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
}
|
||||
|
||||
.radio-button {
|
||||
.radio-button {
|
||||
border: 1px solid #d9d9d9;
|
||||
height: 3.2rem;
|
||||
min-width: 8rem;
|
||||
@@ -89,16 +89,16 @@ const selectOption = (value: any) => {
|
||||
background-color: #fff;
|
||||
font-size: 1.2rem;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
}
|
||||
|
||||
.radio-button:hover {
|
||||
.radio-button:hover {
|
||||
border-color: #000;
|
||||
}
|
||||
}
|
||||
|
||||
.radio-button.is-active {
|
||||
.radio-button.is-active {
|
||||
color: #fff;
|
||||
background-color: #000;
|
||||
border-color: #000;
|
||||
font-family: pingfang_medium;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -198,7 +198,11 @@
|
||||
<span class="help-text">{{ $t("SellerListEdit.categoryTips") }}</span>
|
||||
</div>
|
||||
<div class="form-item-value no-border">
|
||||
<Radio multiple :options="categoryOptions" v-model="currentListing.category" />
|
||||
<Radio
|
||||
multiple
|
||||
:options="categoryOptions"
|
||||
v-model="currentListing.category"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="license-note flex align-center">
|
||||
@@ -234,33 +238,38 @@
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { computed, ref, watch, onMounted } from "vue"
|
||||
import { useRouter } from "vue-router"
|
||||
import { useI18n } from "vue-i18n"
|
||||
import { message } from "ant-design-vue"
|
||||
import SellerHeader from "../../seller-header.vue"
|
||||
import Radio from "./components/Radio.vue"
|
||||
import ImageClipDialog from "../../BrandProfile/image-clip-dialog.vue"
|
||||
import { useStore } from "vuex"
|
||||
import { fetchSketchDetail, uploadFile, fetchListingDetailById, fetchUpdateListing } from "./api"
|
||||
import { computed, ref, watch, onMounted } from "vue"
|
||||
import { useRouter } from "vue-router"
|
||||
import { useI18n } from "vue-i18n"
|
||||
import { message } from "ant-design-vue"
|
||||
import SellerHeader from "../../seller-header.vue"
|
||||
import Radio from "./components/Radio.vue"
|
||||
import ImageClipDialog from "../../BrandProfile/image-clip-dialog.vue"
|
||||
import { useStore } from "vuex"
|
||||
import {
|
||||
fetchSketchDetail,
|
||||
uploadFile,
|
||||
fetchListingDetailById,
|
||||
fetchUpdateListing
|
||||
} from "./api"
|
||||
|
||||
const ROUTER = useRouter()
|
||||
const { t } = useI18n()
|
||||
const ROUTER = useRouter()
|
||||
const { t } = useI18n()
|
||||
|
||||
const imageClipDialogRef = ref<InstanceType<typeof ImageClipDialog> | null>(null)
|
||||
const imageClipDialogRef = ref<InstanceType<typeof ImageClipDialog> | null>(null)
|
||||
|
||||
defineOptions({
|
||||
defineOptions({
|
||||
name: "EditDetail"
|
||||
})
|
||||
})
|
||||
|
||||
const STORE = useStore()
|
||||
const STORE = useStore()
|
||||
|
||||
type CategoryOption = {
|
||||
type CategoryOption = {
|
||||
label: string
|
||||
value: string
|
||||
}
|
||||
}
|
||||
|
||||
type ListingItem = {
|
||||
type ListingItem = {
|
||||
designItemId: number | string | null
|
||||
sketch: string | null
|
||||
mainProductImage: string
|
||||
@@ -277,13 +286,13 @@ type ListingItem = {
|
||||
selected?: boolean
|
||||
}>
|
||||
sketchList: Array<{ url: string | null }>
|
||||
}
|
||||
type StatusType = "draft" | "publish"
|
||||
}
|
||||
type StatusType = "draft" | "publish"
|
||||
|
||||
const createListingItem = (
|
||||
const createListingItem = (
|
||||
sketch: string | null = null,
|
||||
designItemId: number | string | null = null
|
||||
): ListingItem => ({
|
||||
): ListingItem => ({
|
||||
designItemId,
|
||||
sketch,
|
||||
mainProductImage: "",
|
||||
@@ -297,49 +306,49 @@ const createListingItem = (
|
||||
category: null,
|
||||
prodImageList: [],
|
||||
sketchList: []
|
||||
})
|
||||
})
|
||||
|
||||
const topImageList = ["sketch", "mainProductImage", "cover"] as const
|
||||
const topImageTitleMap: Record<(typeof topImageList)[number], string> = {
|
||||
const topImageList = ["sketch", "mainProductImage", "cover"] as const
|
||||
const topImageTitleMap: Record<(typeof topImageList)[number], string> = {
|
||||
sketch: "SellerListEdit.sketch",
|
||||
mainProductImage: "SellerListEdit.mainProductImage",
|
||||
cover: "SellerListEdit.cover"
|
||||
}
|
||||
}
|
||||
|
||||
const genderOptions = STORE.state.UserHabit?.sex.value || []
|
||||
const genderOptions = STORE.state.UserHabit?.sex.value || []
|
||||
|
||||
const fallbackCategoryOptions: Record<string, CategoryOption[]> = {
|
||||
const fallbackCategoryOptions: Record<string, CategoryOption[]> = {
|
||||
MALE: STORE.state.UserHabit?.MalePosition || [],
|
||||
FEMALE: STORE.state.UserHabit?.FemalePosition || []
|
||||
}
|
||||
}
|
||||
|
||||
const currentPage = ref(1)
|
||||
const currentIndex = computed(() => currentPage.value - 1)
|
||||
const currentPage = ref(1)
|
||||
const currentIndex = computed(() => currentPage.value - 1)
|
||||
|
||||
const itemId = ref("")
|
||||
const selectList = ref<ListingItem[]>([createListingItem()])
|
||||
const itemId = ref("")
|
||||
const selectList = ref<ListingItem[]>([createListingItem()])
|
||||
|
||||
const prodImgList = computed(() => currentListing.value.prodImageList || [])
|
||||
const prodImgList = computed(() => currentListing.value.prodImageList || [])
|
||||
|
||||
const categoryOptions = computed(() => {
|
||||
const categoryOptions = computed(() => {
|
||||
const gender = selectList.value[currentIndex.value].gender
|
||||
return fallbackCategoryOptions[gender] || []
|
||||
})
|
||||
})
|
||||
|
||||
const currentListing = computed(() => selectList.value[currentIndex.value])
|
||||
const currentListing = computed(() => selectList.value[currentIndex.value])
|
||||
|
||||
const previewImageMap = computed(() => ({
|
||||
const previewImageMap = computed(() => ({
|
||||
sketch: currentListing.value.sketch,
|
||||
mainProductImage: currentListing.value.mainProductImage,
|
||||
cover: currentListing.value.cover
|
||||
}))
|
||||
}))
|
||||
|
||||
const firstSelectedIndex = ref(null) //显示main标签的图片索引
|
||||
const selectedProdImgs = computed(() => {
|
||||
const firstSelectedIndex = ref(null) //显示main标签的图片索引
|
||||
const selectedProdImgs = computed(() => {
|
||||
return prodImgList.value.filter((item) => item.selected).length
|
||||
})
|
||||
})
|
||||
|
||||
const handleSelectProdImg = (index: number) => {
|
||||
const handleSelectProdImg = (index: number) => {
|
||||
const target = prodImgList.value[index]
|
||||
|
||||
const willSelect = !target.selected
|
||||
@@ -355,10 +364,10 @@ const handleSelectProdImg = (index: number) => {
|
||||
firstSelectedIndex.value = null
|
||||
currentListing.value.mainProductImage = ""
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
const cropType = ref("")
|
||||
const handleClickCrop = (data, type, list = []) => {
|
||||
const cropType = ref("")
|
||||
const handleClickCrop = (data, type, list = []) => {
|
||||
// console.log(data, type)
|
||||
// console.log(selectList.value[currentIndex.value])
|
||||
let origin = []
|
||||
@@ -390,12 +399,12 @@ const handleClickCrop = (data, type, list = []) => {
|
||||
{ ratio, isPreview: true, title: titleList[type], isProduct: true },
|
||||
origin
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
const hasValue = (value: unknown) =>
|
||||
const hasValue = (value: unknown) =>
|
||||
value !== null && value !== undefined && String(value).trim() !== ""
|
||||
|
||||
const getMissingRequiredField = (item: ListingItem) => {
|
||||
const getMissingRequiredField = (item: ListingItem) => {
|
||||
const cover = item.cover || item.mainProductImage || item.sketch
|
||||
const requiredFields = [
|
||||
{ value: item.sketch, label: t("SellerListEdit.sketch") },
|
||||
@@ -417,9 +426,9 @@ const getMissingRequiredField = (item: ListingItem) => {
|
||||
}
|
||||
|
||||
return ""
|
||||
}
|
||||
}
|
||||
|
||||
const validatePublishRequired = () => {
|
||||
const validatePublishRequired = () => {
|
||||
for (let index = 0; index < selectList.value.length; index += 1) {
|
||||
const field = getMissingRequiredField(selectList.value[index])
|
||||
if (!field) continue
|
||||
@@ -437,9 +446,9 @@ const validatePublishRequired = () => {
|
||||
}
|
||||
|
||||
return true
|
||||
}
|
||||
}
|
||||
|
||||
const handleSaveForm = async (type: StatusType) => {
|
||||
const handleSaveForm = async (type: StatusType) => {
|
||||
const paramsList = []
|
||||
selectList.value.forEach((item) => {
|
||||
const params = {
|
||||
@@ -480,8 +489,8 @@ const handleSaveForm = async (type: StatusType) => {
|
||||
})
|
||||
console.log(paramsList)
|
||||
fetchUpdateListing(paramsList)
|
||||
}
|
||||
const handleClickMenu = async (status: StatusType) => {
|
||||
}
|
||||
const handleClickMenu = async (status: StatusType) => {
|
||||
if (status === "publish" && !validatePublishRequired()) return
|
||||
|
||||
await handleSaveForm(status)
|
||||
@@ -494,9 +503,9 @@ const handleClickMenu = async (status: StatusType) => {
|
||||
// console.log("Publishing...", currentListing.value)
|
||||
ROUTER.push({ name: "Status", params: { status: "publish" } })
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
const handleFetchItemDetial = (list) => {
|
||||
const handleFetchItemDetial = (list) => {
|
||||
fetchSketchDetail(list).then((res) => {
|
||||
console.log(res)
|
||||
res.forEach((item, index) => {
|
||||
@@ -510,9 +519,9 @@ const handleFetchItemDetial = (list) => {
|
||||
// fetchListingDetailById(itemId.value).then(res => {
|
||||
// console.log('iddetail',res)
|
||||
// })
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
onMounted(() => {
|
||||
const designItemIds = history.state?.designItemIds || []
|
||||
itemId.value = history.state?.id || ""
|
||||
if (!designItemIds.length) return
|
||||
@@ -524,16 +533,16 @@ onMounted(() => {
|
||||
const list = designItemIds.map((el) => el.designItemId)
|
||||
console.log("list", list.length, list)
|
||||
handleFetchItemDetial(list)
|
||||
})
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.c-svg {
|
||||
.c-svg {
|
||||
width: initial;
|
||||
height: initial;
|
||||
}
|
||||
}
|
||||
|
||||
.edit-detail-wrapper {
|
||||
.edit-detail-wrapper {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100%;
|
||||
@@ -580,9 +589,9 @@ onMounted(() => {
|
||||
// color: #ffffff;
|
||||
// }
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.edit-detail-content {
|
||||
.edit-detail-content {
|
||||
flex: 1;
|
||||
min-height: 0;
|
||||
overflow-y: auto;
|
||||
@@ -954,5 +963,5 @@ onMounted(() => {
|
||||
margin-top: 4rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -65,7 +65,9 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="null" v-show="list.length === 0 && !loading && finish">no data</div>
|
||||
<div class="null" v-show="list.length === 0 && !loading && finish">
|
||||
<img src="@/assets/images/homePage/null_img.png" alt="" />
|
||||
</div>
|
||||
<div class="placeholder" ref="placeholderRef" v-show="!loading"></div>
|
||||
<div class="footer" :class="{ null: list.length === 0 }" v-if="!finish">
|
||||
<a-spin :delay="0.5" v-show="loading" />
|
||||
@@ -120,7 +122,8 @@
|
||||
size: size.value
|
||||
}
|
||||
if (nameOrId.value) data.keyword = nameOrId.value
|
||||
Https.axiosGet(Https.httpUrls.getSellerOrderList, { params: data }).then((res) => {
|
||||
Https.axiosGet(Https.httpUrls.getSellerOrderList, { params: data })
|
||||
.then((res) => {
|
||||
res.content?.forEach((v) => {
|
||||
const obj = {
|
||||
orderId: v.orderId,
|
||||
@@ -142,6 +145,10 @@
|
||||
finish.value = page.value > total.value / size.value
|
||||
loading.value = false
|
||||
})
|
||||
.catch(() => {
|
||||
finish.value = true
|
||||
loading.value = false
|
||||
})
|
||||
}
|
||||
const getSummary = () => {
|
||||
Https.axiosGet(Https.httpUrls.getSellerOrderSummary).then((res) => {
|
||||
@@ -360,8 +367,14 @@
|
||||
}
|
||||
> .null {
|
||||
margin-top: 10rem;
|
||||
text-align: center;
|
||||
color: #999;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
> img {
|
||||
width: 30rem;
|
||||
height: auto;
|
||||
}
|
||||
}
|
||||
> .footer {
|
||||
min-height: 10rem;
|
||||
|
||||
@@ -25,7 +25,7 @@
|
||||
import myEvent from "@/tool/myEvents.js"
|
||||
import { useStore } from "vuex"
|
||||
const store = useStore()
|
||||
store.dispatch("seller/get_designerInfo")
|
||||
// store.dispatch("seller/get_designerInfo")
|
||||
const route = useRoute()
|
||||
const router = useRouter()
|
||||
const visible = ref(false)
|
||||
|
||||
Reference in New Issue
Block a user