feat: 商品编辑
This commit is contained in:
@@ -1737,7 +1737,7 @@ export default {
|
|||||||
GetStarted: '开始体验',
|
GetStarted: '开始体验',
|
||||||
},
|
},
|
||||||
SellerListEdit:{
|
SellerListEdit:{
|
||||||
saveDraft: "保存草稿",
|
saveDraft: "全部保存",
|
||||||
publish: "发布",
|
publish: "发布",
|
||||||
sketch: "线稿图",
|
sketch: "线稿图",
|
||||||
mainProductImage: "产品主图",
|
mainProductImage: "产品主图",
|
||||||
|
|||||||
@@ -1788,7 +1788,7 @@ export default {
|
|||||||
GetStarted: 'Get Started',
|
GetStarted: 'Get Started',
|
||||||
},
|
},
|
||||||
SellerListEdit:{
|
SellerListEdit:{
|
||||||
saveDraft:'Save Draft',
|
saveDraft:'Save All New',
|
||||||
publish:'Publish',
|
publish:'Publish',
|
||||||
sketch:'Sketch',
|
sketch:'Sketch',
|
||||||
mainProductImage:'Main Product Image',
|
mainProductImage:'Main Product Image',
|
||||||
|
|||||||
@@ -204,23 +204,23 @@
|
|||||||
.cropper-box-canvas {
|
.cropper-box-canvas {
|
||||||
background-color: #ffffff;
|
background-color: #ffffff;
|
||||||
|
|
||||||
img {
|
// img {
|
||||||
height: 100%;
|
// height: 100%;
|
||||||
}
|
// }
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
&.is-cover {
|
&.is-cover {
|
||||||
:deep(.vue-cropper) {
|
:deep(.vue-cropper) {
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
:deep(.cropper-box-canvas) {
|
// :deep(.cropper-box-canvas) {
|
||||||
width: 31.1rem !important;
|
// width: 31.1rem !important;
|
||||||
left: 50% !important;
|
// left: 50% !important;
|
||||||
transform: translateX(-50%) !important;
|
// transform: translateX(-50%) !important;
|
||||||
img {
|
// img {
|
||||||
display: none;
|
// display: none;
|
||||||
}
|
// }
|
||||||
}
|
// }
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -8,7 +8,7 @@
|
|||||||
'radio-button',
|
'radio-button',
|
||||||
{
|
{
|
||||||
'is-active': multiple
|
'is-active': multiple
|
||||||
? selectedValues.includes(item.key)
|
? selectedValues.includes(normalizeValue(item.key))
|
||||||
: modelValue === item.key
|
: modelValue === item.key
|
||||||
}
|
}
|
||||||
]"
|
]"
|
||||||
@@ -20,54 +20,73 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { computed } from "vue"
|
import { computed } from "vue"
|
||||||
|
|
||||||
interface Option {
|
interface Option {
|
||||||
name: string | number
|
name: string | number
|
||||||
value: string | number | boolean
|
value: string | number | boolean
|
||||||
key: string
|
key: string
|
||||||
optype: boolean
|
optype: boolean
|
||||||
|
}
|
||||||
|
|
||||||
|
const props = defineProps<{
|
||||||
|
modelValue:
|
||||||
|
| string
|
||||||
|
| number
|
||||||
|
| boolean
|
||||||
|
| Array<string | number | boolean | null | undefined>
|
||||||
|
| null
|
||||||
|
options: Option[] // 按钮选项数组
|
||||||
|
multiple?: boolean // 是否支持多选,默认为 false
|
||||||
|
}>()
|
||||||
|
|
||||||
|
const emit = defineEmits<{
|
||||||
|
(e: "update:modelValue", value: any): void
|
||||||
|
}>()
|
||||||
|
|
||||||
|
const multiple = props.multiple === true
|
||||||
|
|
||||||
|
const normalizeValue = (value: any) =>
|
||||||
|
typeof value === "string" ? value.toLocaleLowerCase() : value
|
||||||
|
|
||||||
|
const selectedValues = computed(() => {
|
||||||
|
if (!multiple) {
|
||||||
|
return typeof props.modelValue === "undefined" || props.modelValue === null
|
||||||
|
? []
|
||||||
|
: [props.modelValue]
|
||||||
}
|
}
|
||||||
|
|
||||||
const props = defineProps<{
|
return Array.isArray(props.modelValue)
|
||||||
modelValue: string | number | boolean | Array<string | number | boolean> | null
|
? props.modelValue
|
||||||
options: Option[] // 按钮选项数组
|
.filter((value) => value !== null && typeof value !== "undefined")
|
||||||
multiple?: boolean // 是否支持多选,默认为 false
|
.map(normalizeValue)
|
||||||
}>()
|
: []
|
||||||
|
})
|
||||||
|
|
||||||
const emit = defineEmits<{
|
const selectOption = (value: any) => {
|
||||||
(e: "update:modelValue", value: any): void
|
if (multiple) {
|
||||||
}>()
|
const selectedValue = normalizeValue(value)
|
||||||
|
const current = Array.isArray(props.modelValue)
|
||||||
|
? props.modelValue
|
||||||
|
.filter((item) => item !== null && typeof item !== "undefined")
|
||||||
|
.map(normalizeValue)
|
||||||
|
: []
|
||||||
|
const index = current.indexOf(selectedValue)
|
||||||
|
|
||||||
const multiple = props.multiple === true
|
if (index >= 0) {
|
||||||
|
current.splice(index, 1)
|
||||||
const selectedValues = computed(() => {
|
} else {
|
||||||
if (!multiple) {
|
current.push(selectedValue)
|
||||||
return typeof props.modelValue === "undefined" || props.modelValue === null
|
|
||||||
? []
|
|
||||||
: [props.modelValue]
|
|
||||||
}
|
}
|
||||||
|
|
||||||
return Array.isArray(props.modelValue) ? props.modelValue : []
|
emit("update:modelValue", current.length ? current : null)
|
||||||
})
|
return
|
||||||
|
|
||||||
const selectOption = (value: any) => {
|
|
||||||
if (multiple) {
|
|
||||||
const current = Array.isArray(props.modelValue) ? [...props.modelValue] : []
|
|
||||||
const index = current.indexOf(value)
|
|
||||||
if (index >= 0) {
|
|
||||||
current.splice(index, 1)
|
|
||||||
} else {
|
|
||||||
current.push(value.toLocaleLowerCase)
|
|
||||||
}
|
|
||||||
emit("update:modelValue", current)
|
|
||||||
return
|
|
||||||
}
|
|
||||||
|
|
||||||
if (props.modelValue !== value) {
|
|
||||||
emit("update:modelValue", value)
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if (props.modelValue !== value) {
|
||||||
|
emit("update:modelValue", value)
|
||||||
|
}
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="less" scoped>
|
<style lang="less" scoped>
|
||||||
|
|||||||
@@ -280,7 +280,7 @@
|
|||||||
price: string
|
price: string
|
||||||
desc: string
|
desc: string
|
||||||
gender: string
|
gender: string
|
||||||
category: string[]
|
category: string[] | null
|
||||||
prodImageList: Array<{
|
prodImageList: Array<{
|
||||||
url: string
|
url: string
|
||||||
selected?: boolean
|
selected?: boolean
|
||||||
@@ -491,6 +491,10 @@
|
|||||||
fetchUpdateListing(paramsList)
|
fetchUpdateListing(paramsList)
|
||||||
}
|
}
|
||||||
const handleClickMenu = async (status: StatusType) => {
|
const handleClickMenu = async (status: StatusType) => {
|
||||||
|
if (status === "draft" && !selectList.value[currentIndex.value].cover) {
|
||||||
|
message.error("请先完成封面制作")
|
||||||
|
return
|
||||||
|
}
|
||||||
if (status === "publish" && !validatePublishRequired()) return
|
if (status === "publish" && !validatePublishRequired()) return
|
||||||
|
|
||||||
await handleSaveForm(status)
|
await handleSaveForm(status)
|
||||||
|
|||||||
Reference in New Issue
Block a user