qiushanhe/ss-crm-manage-web
2
1
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

上传

Browse Source
This commit is contained in:
qsh
2024-05-31 17:38:17 +08:00
parent de522af86f
commit a557255b4a
29 changed files with 675 additions and 260 deletions
Download Patch File Download Diff File Expand all files Collapse all files

70
src/views/MiniMall/Product/add.vue
View File

@@ -16,6 +16,7 @@
placeholder="请选择分类"
filterable
show-all-levels
style="width: 100%"
/>
</el-form-item>
</el-col>
@@ -44,15 +45,15 @@
</el-form-item>
</el-col>
<el-col :span="12" :offset="0">
<el-form-item label="主图" prop="picUrl">
<UploadImg v-model="form.picUrl" height="100px" width="100px" />
<el-form-item label="主图" prop="mainImage">
<UploadImg v-model="form.mainImage" height="100px" width="100px" />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="24" :offset="0">
<el-form-item label="轮播图" prop="sliderPicUrls">
<UploadImgs v-model:modelValue="form.sliderPicUrls" height="100px" width="100px" />
<el-form-item label="轮播图" prop="carouselImages">
<UploadImgs v-model="form.carouselImages" height="100px" width="100px" />
</el-form-item>
</el-col>
</el-row>
@@ -60,7 +61,7 @@
<el-col :span="24" :offset="0">
<el-form-item label="商品规格">
<el-button @click="handleAddSpec">添加规格</el-button>
<el-col v-for="(item, index) in form.specsList" :key="index">
<el-col v-for="(item, index) in form.productSpecList" :key="index">
<div>
<el-text class="mx-1">属性名：</el-text>
<el-tag class="mx-1" closable type="success" @close="handleCloseProperty(index)"
@@ -109,7 +110,7 @@
</template>
</el-table-column>
<el-table-column
v-for="col in form.specsList"
v-for="col in form.productSpecList"
:prop="col.id"
:key="col.id"
:label="col.name"
@@ -135,10 +136,10 @@
</div>
</el-tab-pane>
<el-tab-pane label="详细信息" name="detail">
<Editor v-model:modelValue="form.description" />
<Editor v-model:modelValue="form.detailInfo" />
</el-tab-pane>
</el-tabs>
<ProductAttributesAddForm ref="attributesAddFormRef" :propertyList="form.specsList" />
<ProductAttributesAddForm ref="attributesAddFormRef" :propertyList="form.productSpecList" />
</template>
<script setup>
@@ -148,27 +149,33 @@ const message = useMessage() // 消息弹窗
const tabName = ref('basic')
const form = ref({
name: '',
category: '',
brand: '',
intro: '',
picUrl: '',
sliderPicUrls: [],
specsList: [],
productName: undefined,
productCategory: undefined,
productBrand: undefined,
productIntro: undefined,
mainImage: '',
carouselImages: [],
productSpecList: [],
skuList: [],
description: null
detailInfo: null
})
const rules = ref({})
const attributesAddFormRef = ref() // 添加商品属性表单
const opts = {
brand: [],
productCategory: []
brand: [{ value: 1, label: '品牌1' }],
productCategory: [
{
id: 1,
label: '分类1',
children: [{ id: 2, label: '子分类1' }]
}
]
}
/** 删除属性*/
function handleCloseProperty(index) {
form.value.specsList?.splice(index, 1)
form.value.productSpecList?.splice(index, 1)
}
const attributeIndex = ref(null)
@@ -186,7 +193,7 @@ async function handleInputConfirm(index, propertyId) {
try {
// const id = await PropertyApi.createPropertyValue({ propertyId, name: inputValue.value })
const id = propertyId || parseInt(Math.random() * 1000000)
form.value.specsList[index].values.push({ id, name: inputValue.value })
form.value.productSpecList[index].values.push({ id, name: inputValue.value })
message.success('添加成功')
} catch {
message.error('添加失败，请重试')
@@ -199,7 +206,7 @@ async function handleInputConfirm(index, propertyId) {
function getTableList() {
let list = []
form.value.specsList.map((item) => {
form.value.productSpecList.map((item) => {
if (!list.length) {
item.values.map((it) => {
const obj = {}
@@ -238,8 +245,7 @@ const setInputRef = (el) => {
}
function handleAddSpec() {
const id = parseInt(Math.random() * 1000)
form.value.specsList.push({ name: `测试规格${id}`, id, values: [] })
attributesAddFormRef.value.open()
}
function onSubmit() {
@@ -249,19 +255,19 @@ function onSubmit() {
onMounted(() => {
if (route.query?.id) {
form.value = {
name: '商品名称哦~'
productName: '商品名称哦~'
}
} else {
form.value = {
name: '',
category: '',
brand: '',
intro: '',
picUrl: '',
sliderPicUrls: [],
specsList: [],
productName: undefined,
productCategory: undefined,
productBrand: undefined,
productIntro: undefined,
mainImage: 'https://ss-cloud.ahduima.com/1001/1796426117251600384.png',
carouselImages: ['https://ss-cloud.ahduima.com/1001/1796426117251600384.png'],
productSpecList: [],
skuList: [],
description: null
detailInfo: null
}
}
})

26
src/views/MiniMall/Product/index.vue
View File

@@ -38,9 +38,11 @@
/>
</el-form-item>
<el-form-item>
<el-button @click="handleQuery"> 搜索 </el-button>
<el-button @click="resetQuery"> 重置 </el-button>
<el-button plain type="primary" @click="openForm"> 新增 </el-button>
<el-button @click="handleQuery" v-hasPermi="['mall:prod:search']"> 搜索 </el-button>
<el-button @click="resetQuery" v-hasPermi="['mall:prod:reset']"> 重置 </el-button>
<el-button plain type="primary" @click="openForm" v-hasPermi="['mall:prod:add']">
新增
</el-button>
</el-form-item>
</el-form>
@@ -71,8 +73,22 @@
<el-table-column fixed="right" label="操作" min-width="80">
<template #default="{ row }">
<!-- TODO：【详情】，可以后面点做哈 -->
<el-button link type="primary" @click="openForm(row.productId)"> 修改 </el-button>
<el-button link type="danger" @click="handleDelete(row.productId)"> 删除 </el-button>
<el-button
link
type="primary"
@click="openForm(row.productId)"
v-hasPermi="['mall:prod:update']"
>
修改
</el-button>
<el-button
link
type="danger"
@click="handleDelete(row.productId)"
v-hasPermi="['mall:prod:delete']"
>
删除
</el-button>
</template>
</el-table-column>
</el-table>