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-06-05 17:08:27 +08:00
parent a557255b4a
commit 94943df4f9
30 changed files with 1069 additions and 846 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
src/views/MiniMall/MallSet/Comp/BrandSet.vue
View File

@@ -32,8 +32,10 @@
/>
<el-table-column label="操作">
<template #default="scope">
<el-button type="primary" text @click="openForm('update', scope.row.id)">修改</el-button>
<el-button type="danger" text @click="handleDelete(scope.row.id)">删除</el-button>
<el-button type="primary" text @click="openForm('update', scope.row.brandId)"
>修改</el-button
>
<el-button type="danger" text @click="handleDelete(scope.row.brandId)">删除</el-button>
</template>
</el-table-column>
</el-table>
@@ -54,6 +56,9 @@ import { dateFormatter } from '@/utils/formatTime'
import * as ProductBrandApi from '@/api/mall/product/brand'
import DialogBrand from './DialogBrand.vue'
const message = useMessage() // 消息弹窗
const { t } = useI18n() // 国际化
const searchForm = ref({
name: undefined,
pageNo: 1,
@@ -102,8 +107,14 @@ async function handleDelete(id) {
message.success(t('common.delSuccess'))
// 刷新列表
await getList()
} catch {}
} catch (err) {
console.log(err)
}
}
onMounted(() => {
handleQuery()
})
</script>
<style lang="scss" scoped></style>

14
src/views/MiniMall/MallSet/Comp/CategorySet.vue
View File

@@ -16,10 +16,10 @@
</el-form-item>
</el-form>
<el-table v-loading="loading" :data="list" row-key="id" :tree-props="{ children: 'children' }">
<el-table-column prop="categoryName" label="分类名称" />
<el-table-column prop="orderNum" label="排序" width="100px" />
<el-table-column prop="name" label="分类名称" />
<el-table-column prop="sort" label="排序" width="100px" />
<el-table-column prop="remark" label="备注" />
<el-table-column label="状态" align="center" min-width="150" prop="status">
<el-table-column label="状态" min-width="150" prop="status">
<template #default="scope">
<dict-tag :type="DICT_TYPE.COMMON_STATUS" :value="scope.row.status" />
</template>
@@ -33,16 +33,16 @@
<el-table-column label="操作">
<template #default="scope">
<el-button type="primary" text @click="openForm('update', scope.row)">修改</el-button>
<el-button type="primary" text @click="openForm('createChildren', scope.row)"
>新增</el-button
>
<el-button type="primary" text @click="openForm('createChildren', scope.row)">
新增
</el-button>
<el-button type="danger" text @click="handleDelete(scope.row.id)">删除</el-button>
</template>
</el-table-column>
</el-table>
<Pagination
v-model:limit="searchForm.pageSize"
v-model:page="searchForm.pageNum"
v-model:page="searchForm.pageNo"
:total="total"
@pagination="handleQuery"
/>

14
src/views/MiniMall/MallSet/Comp/DialogCategory.vue
View File

@@ -7,7 +7,7 @@
:rules="formRules"
label-width="80px"
>
<el-form-item v-if="formData.level > 1" label="上级分类">
<el-form-item v-if="formData.parentCategory" label="上级分类">
<el-input v-model="formData.parentCategory" disabled />
</el-form-item>
<el-form-item label="分类名称" prop="name">
@@ -71,12 +71,14 @@ const open = async (type, info) => {
if (type == 'update') {
formData.value = await ProductCategoryApi.getCategory(info.id)
} else {
formData.value.level = info.level + 1
formData.value.parentCategory = info.name
formData.value.parentId = info.id
}
} finally {
formLoading.value = false
}
} else {
formData.value.parentId = 0
}
}
defineExpose({ open }) // 提供 open 方法，用于打开弹窗
@@ -91,12 +93,12 @@ const submitForm = async () => {
// 提交请求
formLoading.value = true
try {
if (formType.value === 'create') {
if (formType.value === 'update') {
await ProductCategoryApi.updateCategory(formData.value)
message.success(t('common.updateSuccess'))
} else {
await ProductCategoryApi.createCategory(formData.value)
message.success(t('common.createSuccess'))
} else {
await ProductCategoryApi.updateCategory(data)
message.success(t('common.updateSuccess'))
}
dialogVisible.value = false
// 发送操作成功的事件

36
src/views/MiniMall/MallSet/Comp/DialogSupplier.vue
View File

@@ -7,11 +7,11 @@
:rules="formRules"
label-width="80px"
>
<el-form-item label="名称" prop="name">
<el-input v-model="formData.name" placeholder="请输入供应商名称" />
<el-form-item label="名称" prop="label">
<el-input v-model="formData.label" placeholder="请输入供应商名称" />
</el-form-item>
<el-form-item label="排序" prop="orderNum">
<el-input v-model="formData.orderNum" placeholder="请输入排序" type="number" :min="0" />
<el-form-item label="排序" prop="sort">
<el-input v-model="formData.sort" placeholder="请输入排序" type="number" :min="0" />
</el-form-item>
<el-form-item label="备注" prop="remark">
<el-input
@@ -29,6 +29,7 @@
</Dialog>
</template>
<script name="DialogSupplier" setup>
import * as dictApi from '@/api/system/dict/dict.data'
const { t } = useI18n() // 国际化
const message = useMessage() // 消息弹窗
@@ -37,27 +38,26 @@ const dialogTitle = ref('') // 弹窗的标题
const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
const formType = ref('') // 表单的类型：create - 新增；update - 修改
const formData = ref({
name: '',
orderNum: 1,
label: '',
sort: 1,
remark: ''
})
const formRules = reactive({
name: [{ required: true, message: '名称不能为空', trigger: 'blur' }]
label: [{ required: true, message: '名称不能为空', trigger: 'blur' }]
})
const formRef = ref() // 表单 Ref
/** 打开弹窗 */
const open = async (type, info) => {
const open = async (type, id) => {
dialogVisible.value = true
dialogTitle.value = type == 'update' ? '修改供应商' : '新增供应商'
formType.value = type
resetForm()
// 修改时，设置数据
if (info.id) {
if (id) {
formLoading.value = true
try {
formData.value = { ...info }
// formData.value = await UserApi.getUser(id)
formData.value = await dictApi.getDictData(id)
} finally {
formLoading.value = false
}
@@ -75,12 +75,14 @@ const submitForm = async () => {
// 提交请求
formLoading.value = true
try {
// const data = formData.value as unknown as UserApi.UserVO
if (!formData.value.value) {
formData.value.value = formData.value.label
}
if (formType.value === 'create') {
// await UserApi.createUser(data)
await dictApi.createDictData(formData.value)
message.success(t('common.createSuccess'))
} else {
// await UserApi.updateUser(data)
await dictApi.updateDictData(formData.value)
message.success(t('common.updateSuccess'))
}
dialogVisible.value = false
@@ -94,8 +96,10 @@ const submitForm = async () => {
/** 重置表单 */
const resetForm = () => {
formData.value = {
name: '',
orderNum: 1,
label: '',
sort: 1,
status: 0,
dictType: 'erp_supplier',
remark: ''
}
formRef.value?.resetFields()

75
src/views/MiniMall/MallSet/Comp/SupplierSet.vue
View File

@@ -16,23 +16,27 @@
</el-form-item>
</el-form>
<el-table v-loading="loading" :data="tableList">
<el-table-column prop="name" label="供应商名称" />
<el-table-column prop="orderNum" label="排序" width="100px" />
<el-table-column prop="label" label="供应商名称" />
<el-table-column prop="sort" label="排序" width="100px" />
<el-table-column prop="remark" label="备注" />
<el-table-column label="创建时间" prop="createTime" width="180px" />
<el-table-column label="创建人" prop="createUser" width="150px" />
<el-table-column
label="创建时间"
prop="createTime"
width="180px"
:formatter="dateFormatter"
/>
<el-table-column label="操作">
<template #default="scope">
<el-button type="primary" text @click="openForm('update', scope.row)">修改</el-button>
<el-button type="danger" text @click="handleDelete(scope.row)">删除</el-button>
<el-button type="primary" text @click="openForm('update', scope.row.id)">修改</el-button>
<el-button type="danger" text @click="handleDelete(scope.row.id)">删除</el-button>
</template>
</el-table-column>
</el-table>
<Pagination
v-model:limit="searchForm.pageSize"
v-model:page="searchForm.pageNum"
v-model:page="searchForm.pageNo"
:total="total"
@pagination="handleQuery"
@pagination="getList"
/>
<DialogSupplier ref="brandDialog" @success="handleQuery" />
@@ -40,11 +44,18 @@
</template>
<script setup name="SupplierSet">
import { dateFormatter } from '@/utils/formatTime'
import DialogSupplier from './DialogSupplier.vue'
import * as dictApi from '@/api/system/dict/dict.data'
const { t } = useI18n() // 国际化
const message = useMessage() // 消息弹窗
const searchForm = ref({
pageNum: 1,
pageSize: 20
label: '',
pageSize: 20,
pageNo: 1,
dictType: 'erp_supplier'
})
const total = ref(0)
@@ -53,43 +64,49 @@ const tableList = ref([])
const loading = ref(false)
function handleQuery() {
searchForm.value.pageNum = 1
searchForm.value.pageNo = 1
getList()
}
function resetQuery() {
searchForm.value = {
name: '',
label: '',
pageSize: 20,
pageNum: 1
pageNo: 1,
dictType: 'erp_supplier'
}
getList()
}
function getList() {
tableList.value = [
{
id: 1,
name: '测试'
}
]
}
function openForm(type, info) {
brandDialog.value.open(type, info)
}
async function handleDelete(row) {
async function getList() {
loading.value = true
try {
const data = await dictApi.getDictDataPage(searchForm.value)
tableList.value = data.list
total.value = data.total
} finally {
loading.value = false
}
}
function openForm(type, id) {
brandDialog.value.open(type, id)
}
async function handleDelete(id) {
try {
console.log(row)
// 删除的二次确认
await message.delConfirm()
// 发起删除
// await UserApi.deleteUser(row.id)
await dictApi.deleteDictData(id)
message.success(t('common.delSuccess'))
// 刷新列表
await getList()
} catch {}
}
onMounted(() => {
handleQuery()
})
</script>
<style lang="scss" scoped></style>

24
src/views/MiniMall/Product/Comp/ProductAttributesAddForm.vue
View File

@@ -6,6 +6,7 @@
:model="formData"
:rules="formRules"
label-width="80px"
@submit.prevent
>
<el-form-item label="属性名称" prop="name">
<el-input v-model="formData.name" placeholder="请输入名称" />
@@ -33,7 +34,7 @@ const formRules = reactive({
name: [{ required: true, message: '名称不能为空', trigger: 'blur' }]
})
const formRef = ref() // 表单 Ref
const attributeList = ref([]) // 商品属性列表
const attributeList = ref<any>([]) // 商品属性列表
const props = defineProps({
propertyList: {
type: Array,
@@ -69,17 +70,13 @@ const submitForm = async () => {
formLoading.value = true
try {
const data = formData.value as PropertyApi.PropertyVO
// 检查属性是否已存在，如果有则返回属性和其下属性值
const res = await PropertyApi.getPropertyListAndValue({ name: data.name })
if (res.length === 0) {
const propertyId = await PropertyApi.createProperty(data)
attributeList.value.push({ id: propertyId, ...formData.value, values: [] })
} else {
if (res[0].values === null) {
res[0].values = []
}
attributeList.value.push(res[0]) // 因为只用一个
}
const propertyId = await PropertyApi.createProperty(data)
// 添加到属性列表
attributeList.value.push({
id: propertyId + '',
...formData.value,
values: []
})
message.success(t('common.createSuccess'))
dialogVisible.value = false
} finally {
@@ -90,8 +87,7 @@ const submitForm = async () => {
/** 重置表单 */
const resetForm = () => {
formData.value = {
name: '',
remark: ''
name: ''
}
formRef.value?.resetFields()
}

317
src/views/MiniMall/Product/Comp/SkuList.vue
View File

@@ -1,317 +0,0 @@
<template>
<el-table
:data="isBatch ? skuList : formData.skus"
border
class="tabNumWidth"
max-height="500"
size="small"
>
<el-table-column align="center" fixed="left" label="图片" min-width="100">
<template #default="{ row }">
<UploadImg v-model="row.picUrl" height="80px" width="100%" />
</template>
</el-table-column>
<template v-if="formData.specType && !isBatch">
<!-- 根据商品属性动态添加 -->
<el-table-column
v-for="(item, index) in tableHeaders"
:key="index"
:label="item.label"
align="center"
min-width="120"
>
<template #default="{ row }">
<!-- TODO puhui999：展示成蓝色，有点区分度哈 -->
{{ row.properties[index]?.valueName }}
</template>
</el-table-column>
</template>
<el-table-column align="center" label="商品条码" min-width="168">
<template #default="{ row }">
<el-input v-model="row.barCode" class="w-100%" />
</template>
</el-table-column>
<el-table-column align="center" label="销售价(元)" min-width="168">
<template #default="{ row }">
<el-input-number v-model="row.price" :min="0" :precision="2" :step="0.1" class="w-100%" />
</template>
</el-table-column>
<el-table-column align="center" label="市场价(元)" min-width="168">
<template #default="{ row }">
<el-input-number
v-model="row.marketPrice"
:min="0"
:precision="2"
:step="0.1"
class="w-100%"
/>
</template>
</el-table-column>
<el-table-column align="center" label="成本价(元)" min-width="168">
<template #default="{ row }">
<el-input-number
v-model="row.costPrice"
:min="0"
:precision="2"
:step="0.1"
class="w-100%"
/>
</template>
</el-table-column>
<el-table-column align="center" label="库存" min-width="168">
<template #default="{ row }">
<el-input-number v-model="row.stock" :min="0" class="w-100%" />
</template>
</el-table-column>
<el-table-column align="center" label="重量(kg)" min-width="168">
<template #default="{ row }">
<el-input-number v-model="row.weight" :min="0" :precision="2" :step="0.1" class="w-100%" />
</template>
</el-table-column>
<el-table-column align="center" label="体积(m^3)" min-width="168">
<template #default="{ row }">
<el-input-number v-model="row.volume" :min="0" :precision="2" :step="0.1" class="w-100%" />
</template>
</el-table-column>
<template v-if="formData.subCommissionType">
<el-table-column align="center" label="一级返佣(元)" min-width="168">
<template #default="{ row }">
<el-input-number
v-model="row.subCommissionFirstPrice"
:min="0"
:precision="2"
:step="0.1"
class="w-100%"
/>
</template>
</el-table-column>
<el-table-column align="center" label="二级返佣(元)" min-width="168">
<template #default="{ row }">
<el-input-number
v-model="row.subCommissionSecondPrice"
:min="0"
:precision="2"
:step="0.1"
class="w-100%"
/>
</template>
</el-table-column>
</template>
<el-table-column v-if="formData.specType" align="center" fixed="right" label="操作" width="80">
<template #default="{ row }">
<el-button v-if="isBatch" link size="small" type="primary" @click="batchAdd">
批量添加
</el-button>
<el-button v-else link size="small" type="primary" @click="deleteSku(row)">删除</el-button>
</template>
</el-table-column>
</el-table>
</template>
<script lang="ts" name="SkuList" setup>
import { PropType } from 'vue'
import { copyValueToTarget } from '@/utils'
import { propTypes } from '@/utils/propTypes'
import { UploadImg } from '@/components/UploadFile'
import type { Property, SkuType, SpuType } from '@/api/mall/product/spu'
const props = defineProps({
propFormData: {
type: Object as PropType<SpuType>,
default: () => {}
},
propertyList: {
type: Array,
default: () => []
},
isBatch: propTypes.bool.def(false) // 是否作为批量操作组件
})
const formData = ref<SpuType>() // 表单数据
const skuList = ref<SkuType[]>([
{
price: 0, // 商品价格
marketPrice: 0, // 市场价
costPrice: 0, // 成本价
barCode: '', // 商品条码
picUrl: '', // 图片地址
stock: 0, // 库存
weight: 0, // 商品重量
volume: 0, // 商品体积
subCommissionFirstPrice: 0, // 一级分销的佣金
subCommissionSecondPrice: 0 // 二级分销的佣金
}
]) // 批量添加时的临时数据
// TODO @puhui999：保存时，每个商品规格的表单要校验下。例如说，销售金额最低是 0.01 这种。
/** 批量添加 */
const batchAdd = () => {
formData.value.skus.forEach((item) => {
copyValueToTarget(item, skuList.value[0])
})
}
/** 删除 sku */
const deleteSku = (row) => {
const index = formData.value.skus.findIndex(
// 直接把列表转成字符串比较
(sku) => JSON.stringify(sku.properties) === JSON.stringify(row.properties)
)
formData.value.skus.splice(index, 1)
}
const tableHeaders = ref<{ prop: string; label: string }[]>([]) // 多属性表头
/**
* 将传进来的值赋值给 skuList
*/
watch(
() => props.propFormData,
(data) => {
if (!data) return
formData.value = data
},
{
deep: true,
immediate: true
}
)
/** 生成表数据 */
const generateTableData = (propertyList: any[]) => {
// 构建数据结构
const propertyValues = propertyList.map((item) =>
item.values.map((v) => ({
propertyId: item.id,
propertyName: item.name,
valueId: v.id,
valueName: v.name
}))
)
// TODO @puhui：是不是 buildSkuList，这样容易理解一点哈。item 改成 sku
const buildList = build(propertyValues)
// 如果回显的 sku 属性和添加的属性不一致则重置 skus 列表
if (!validateData(propertyList)) {
// 如果不一致则重置表数据，默认添加新的属性重新生成 sku 列表
formData.value!.skus = []
}
for (const item of buildList) {
const row = {
properties: Array.isArray(item) ? item : [item], // 如果只有一个属性的话返回的是一个 property 对象
price: 0,
marketPrice: 0,
costPrice: 0,
barCode: '',
picUrl: '',
stock: 0,
weight: 0,
volume: 0,
subCommissionFirstPrice: 0,
subCommissionSecondPrice: 0
}
// 如果存在属性相同的 sku 则不做处理
const index = formData.value!.skus.findIndex(
(sku) => JSON.stringify(sku.properties) === JSON.stringify(row.properties)
)
if (index !== -1) {
continue
}
formData.value.skus.push(row)
}
}
/**
* 生成 skus 前置校验
*/
const validateData = (propertyList: any[]) => {
const skuPropertyIds = []
formData.value.skus.forEach((sku) =>
sku.properties
?.map((property) => property.propertyId)
.forEach((propertyId) => {
if (skuPropertyIds.indexOf(propertyId) === -1) {
skuPropertyIds.push(propertyId)
}
})
)
const propertyIds = propertyList.map((item) => item.id)
return skuPropertyIds.length === propertyIds.length
}
/** 构建所有排列组合 */
const build = (propertyValuesList: Property[][]) => {
if (propertyValuesList.length === 0) {
return []
} else if (propertyValuesList.length === 1) {
return propertyValuesList[0]
} else {
const result: Property[][] = []
const rest = build(propertyValuesList.slice(1))
for (let i = 0; i < propertyValuesList[0].length; i++) {
for (let j = 0; j < rest.length; j++) {
// 第一次不是数组结构，后面的都是数组结构
if (Array.isArray(rest[j])) {
result.push([propertyValuesList[0][i], ...rest[j]])
} else {
result.push([propertyValuesList[0][i], rest[j]])
}
}
}
return result
}
}
/** 监听属性列表，生成相关参数和表头 */
watch(
() => props.propertyList,
(propertyList) => {
// 如果不是多规格则结束
if (!formData.value.specType) {
return
}
// 如果当前组件作为批量添加数据使用，则重置表数据
if (props.isBatch) {
skuList.value = [
{
price: 0,
marketPrice: 0,
costPrice: 0,
barCode: '',
picUrl: '',
stock: 0,
weight: 0,
volume: 0,
subCommissionFirstPrice: 0,
subCommissionSecondPrice: 0
}
]
}
// 判断代理对象是否为空
if (JSON.stringify(propertyList) === '[]') {
return
}
// 重置表头
tableHeaders.value = []
// 生成表头
propertyList.forEach((item, index) => {
// name加属性项index区分属性值
tableHeaders.value.push({ prop: `name${index}`, label: item.name })
})
// 如果回显的 sku 属性和添加的属性一致则不处理
if (validateData(propertyList)) {
return
}
// 添加新属性没有属性值也不做处理
if (propertyList.some((item) => item.values.length === 0)) {
return
}
// 生成 table 数据，即 sku 列表
generateTableData(propertyList)
},
{
deep: true,
immediate: true
}
)
// 暴露出生成 sku 方法，给添加属性成功时调用
defineExpose({ generateTableData })
</script>

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

@@ -1,5 +1,5 @@
<template>
<el-tabs v-model="tabName" type="border-card" tab-position="top">
<el-tabs v-model="tabName" type="border-card" tab-position="top" v-loading="formLoading">
<el-tab-pane label="商品信息" name="basic">
<el-form :model="form" ref="spuForm" :rules="rules" label-width="90px">
<el-row :gutter="20">
@@ -11,9 +11,10 @@
<el-col :span="8" :offset="0">
<el-form-item label="分类" prop="productCategory">
<el-cascader
:options="opts.productCategory"
:options="opts.category"
v-model="form.productCategory"
placeholder="请选择分类"
:props="{ label: 'name', value: 'id' }"
filterable
show-all-levels
style="width: 100%"
@@ -25,9 +26,9 @@
<el-select v-model="form.productBrand" placeholder="请选择品牌" filterable>
<el-option
v-for="item in opts.brand"
:key="item.value"
:label="item.label"
:value="item.value"
:key="item.brandId"
:label="item.name"
:value="item.brandId"
/>
</el-select>
</el-form-item>
@@ -110,11 +111,16 @@
</template>
</el-table-column>
<el-table-column
v-for="col in form.productSpecList"
:prop="col.id"
v-for="(col, index) in form.productSpecList"
:key="col.id"
:label="col.name"
/>
>
<template #default="{ row }">
<span style="font-weight: bold; color: #40aaff">
{{ row.properties[index]?.valueName }}
</span>
</template>
</el-table-column>
<el-table-column prop="price" label="销售价">
<template #default="{ row }">
<el-input-number v-model="row.price" :min="0.01" :step="1" />
@@ -130,22 +136,30 @@
</el-col>
</el-row>
</el-form>
<div class="mt-20px flex justify-center">
<el-button type="primary" @click="onSubmit">保存</el-button>
<el-button plain>重置</el-button>
</div>
</el-tab-pane>
<el-tab-pane label="详细信息" name="detail">
<Editor v-model:modelValue="form.detailInfo" />
</el-tab-pane>
</el-tabs>
<div class="mt-20px flex justify-center">
<el-button type="primary" @click="onSubmit">保存</el-button>
<el-button plain>重置</el-button>
</div>
<ProductAttributesAddForm ref="attributesAddFormRef" :propertyList="form.productSpecList" />
</template>
<script setup>
import { cloneDeep } from 'lodash-es'
import * as PropertyApi from '@/api/mall/product/property'
import * as ProductApi from '@/api/mall/product/index'
import ProductAttributesAddForm from './Comp/ProductAttributesAddForm.vue'
import * as BrandApi from '@/api/mall/product/brand'
import * as CategoryApi from '@/api/mall/product/category'
import { handleTree } from '@/utils/tree'
const route = useRoute()
const message = useMessage() // 消息弹窗
const { t } = useI18n() // 国际化
const tabName = ref('basic')
const form = ref({
@@ -157,25 +171,32 @@ const form = ref({
carouselImages: [],
productSpecList: [],
skuList: [],
detailInfo: null
detailInfo: null,
status: 0
})
const rules = ref({})
const rules = {
productName: { required: true, message: '产品名称不可为空', trigger: 'blur' }
}
const attributesAddFormRef = ref() // 添加商品属性表单
const opts = {
brand: [{ value: 1, label: '品牌1' }],
productCategory: [
{
id: 1,
label: '分类1',
children: [{ id: 2, label: '子分类1' }]
}
]
const opts = ref({
brand: [],
category: []
})
async function getOptions() {
BrandApi.getSimpleBrandList().then((data) => {
opts.value.brand = data || []
})
CategoryApi.getCategorySimpleList().then((data) => {
opts.value.category = handleTree(data || [])
})
}
/** 删除属性*/
function handleCloseProperty(index) {
form.value.productSpecList?.splice(index, 1)
getTableList()
}
const attributeIndex = ref(null)
@@ -191,8 +212,7 @@ async function handleInputConfirm(index, propertyId) {
if (inputValue.value) {
// 保存属性值
try {
// const id = await PropertyApi.createPropertyValue({ propertyId, name: inputValue.value })
const id = propertyId || parseInt(Math.random() * 1000000)
const id = await PropertyApi.createPropertyValue({ propertyId, name: inputValue.value })
form.value.productSpecList[index].values.push({ id, name: inputValue.value })
message.success('添加成功')
} catch {
@@ -201,31 +221,88 @@ async function handleInputConfirm(index, propertyId) {
}
attributeIndex.value = null
inputValue.value = ''
form.value.skuList = getTableList()
getTableList()
}
/** 删除属性值*/
function handleCloseValue(index, valueIndex) {
form.value.productSpecList[index].values?.splice(valueIndex, 1)
getTableList()
}
function getTableList() {
let list = []
form.value.productSpecList.map((item) => {
if (!list.length) {
item.values.map((it) => {
const obj = {}
obj[it.id] = it.name
list.push(obj)
})
} else {
item.values.map((it, index) => {
if (index < list.length) {
list[index][it.id] = it.name
} else {
const obj = {}
obj[it.id] = it.name
list.push(obj)
}
})
const propertyList = [...form.value.productSpecList]
// 构建数据结构
const propertyValues = propertyList.map((item) =>
item.values.map((v) => ({
propertyId: item.id,
propertyName: item.name,
valueId: v.id,
valueName: v.name
}))
)
const buildSkuList = build(propertyValues)
// 如果回显的 sku 属性和添加的属性不一致则重置 skuList 列表
if (!validateData(propertyList)) {
// 如果不一致则重置表数据，默认添加新的属性重新生成 sku 列表
// form.value.skuList = []
}
form.value.skuList = []
for (const item of buildSkuList) {
const row = {
properties: Array.isArray(item) ? item : [item], // 如果只有一个属性的话返回的是一个 property 对象
price: 0.01,
intro: '',
specsName: ''
}
})
return list
// 如果存在属性相同的 sku 则不做处理
const index = form.value.skuList.findIndex(
(sku) => JSON.stringify(sku.properties) === JSON.stringify(row.properties)
)
if (index !== -1) {
continue
}
form.value.skuList.push(row)
}
}
/**
* 生成 skuList 前置校验
*/
const validateData = (propertyList) => {
const skuPropertyIds = []
form.value.skuList.forEach((sku) =>
sku.properties.map((property) => {
if (skuPropertyIds.indexOf(property.propertyId) === -1) {
skuPropertyIds.push(property.propertyId)
}
})
)
const propertyIds = propertyList.map((item) => item.id)
return skuPropertyIds.length === propertyIds.length
}
/** 构建所有排列组合 */
const build = (propertyValuesList) => {
if (propertyValuesList.length === 0) {
return []
} else if (propertyValuesList.length === 1) {
return propertyValuesList[0]
} else {
const result = []
const rest = build(propertyValuesList.slice(1))
for (let i = 0; i < propertyValuesList[0].length; i++) {
for (let j = 0; j < rest.length; j++) {
// 第一次不是数组结构，后面的都是数组结构
if (Array.isArray(rest[j])) {
result.push([propertyValuesList[0][i], ...rest[j]])
} else {
result.push([propertyValuesList[0][i], rest[j]])
}
}
}
return result
}
}
const inputRef = ref([]) //标签输入框Ref
@@ -248,14 +325,103 @@ function handleAddSpec() {
attributesAddFormRef.value.open()
}
const spuForm = ref()
function onSubmit() {
message.success('保存成功！')
spuForm.value.validate(async (valid) => {
if (valid && validateSku()) {
// 深拷贝一份, 这样最终 server 端不满足，不需要影响原始数据
const deepCopyFormData = cloneDeep(unref(form.value))
deepCopyFormData.productSpecList = deepCopyFormData.skuList
if (deepCopyFormData.productCategory && deepCopyFormData.productCategory.length) {
deepCopyFormData.productCategory = deepCopyFormData.productCategory.at(-1)
}
delete deepCopyFormData.skuList
// 校验都通过后提交表单
const data = deepCopyFormData
const id = route.query.id
if (!id) {
await ProductApi.createProduct(data)
message.success(t('common.createSuccess'))
} else {
await ProductApi.updateProduct(data)
message.success(t('common.updateSuccess'))
}
}
})
}
onMounted(() => {
// 作为活动组件的校验
const ruleConfig = [
{
name: 'specsName',
rule: (arg) => arg.length,
message: '规格名称不可为空 ！！！'
},
{
name: 'price',
rule: (arg) => arg >= 0.01,
message: '商品销售价格必须大于等于 0.01 元！！！'
}
]
/**
* 保存时，每个商品规格的表单要校验下。例如说，销售金额最低是 0.01 这种。
*/
const validateSku = () => {
let warningInfo = '请检查商品各行相关属性配置，'
let validate = form.value.skuList.length > 0 // 默认通过
if (!form.value.skuList.length) {
message.info('请添加商品规格！！！')
}
for (const sku of form.value.skuList) {
for (const rule of ruleConfig) {
const arg = getValue(sku, rule.name)
if (!rule.rule(arg)) {
validate = false // 只要有一个不通过则直接不通过
warningInfo += rule.message
break
}
}
// 只要有一个不通过则结束后续的校验
if (!validate) {
message.warning(warningInfo)
throw new Error(warningInfo)
}
}
return validate
}
const getValue = (obj, arg) => {
const keys = arg.split('.')
let value = obj
for (const key of keys) {
if (value && typeof value === 'object' && key in value) {
value = value[key]
} else {
value = undefined
break
}
}
return value
}
const formLoading = ref(false)
/** 获得详情 */
const getDetail = async () => {
if (route.query?.id) {
form.value = {
productName: '商品名称哦~'
formLoading.value = true
try {
const res = await ProductApi.getProduct(route.query.id)
const propList = getPropertyList(res.productSpecList)
form.value = {
...res,
skuList: res.productSpecList,
productSpecList: propList
}
} finally {
formLoading.value = false
}
} else {
form.value = {
@@ -267,9 +433,41 @@ onMounted(() => {
carouselImages: ['https://ss-cloud.ahduima.com/1001/1796426117251600384.png'],
productSpecList: [],
skuList: [],
detailInfo: null
detailInfo: null,
status: 0
}
}
}
/**
* 获得商品的规格列表 - 商品相关的公共函数
*
* @param spu
* @return PropertyAndValues 规格列表
*/
const getPropertyList = (list) => {
// 直接拿返回的 skus 属性逆向生成出 propertyList
const properties = []
// 只有是多规格才处理
list.forEach((sku) => {
sku.properties?.forEach(({ propertyId, propertyName, valueId, valueName }) => {
// 添加属性
if (!properties?.some((item) => item.id === propertyId)) {
properties.push({ id: propertyId, name: propertyName, values: [] })
}
// 添加属性值
const index = properties?.findIndex((item) => item.id === propertyId)
if (!properties[index].values?.some((value) => value.id === valueId)) {
properties[index].values?.push({ id: valueId, name: valueName })
}
})
})
return properties
}
onMounted(async () => {
getOptions()
await getDetail()
})
</script>

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

@@ -20,9 +20,9 @@
>
<el-option
v-for="item in opts.brand"
:key="item.value"
:label="item.label"
:value="item.value"
:key="item.brandId"
:label="item.name"
:value="item.brandId"
/>
</el-select>
</el-form-item>
@@ -33,6 +33,7 @@
placeholder="请选择分类"
clearable
filterable
:props="{ label: 'name', value: 'id', checkStrictly: true }"
show-all-levels
@change="handleQuery"
/>
@@ -40,7 +41,7 @@
<el-form-item>
<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 plain type="primary" @click="openForm(null)" v-hasPermi="['mall:prod:add']">
新增
</el-button>
</el-form-item>
@@ -53,6 +54,16 @@
<div class="pl-100px pr-100px">
<el-table :data="row.productSpecList">
<el-table-column label="规格名称" prop="specsName" />
<el-table-column />
<el-table-column
v-for="(item, index) in row.properties"
:key="index"
:label="item.label"
>
<template #default="scope">
{{ scope.row.properties[index].valueName }}
</template>
</el-table-column>
<el-table-column label="售价" prop="price" />
<el-table-column label="简介" prop="intro" />
</el-table>
@@ -105,6 +116,9 @@
import { dateFormatter } from '@/utils/formatTime'
import { createImageViewer } from '@/components/ImageViewer'
import * as ProductApi from '@/api/mall/product'
import * as BrandApi from '@/api/mall/product/brand'
import * as CategoryApi from '@/api/mall/product/category'
import { handleTree } from '@/utils/tree'
const { currentRoute, push } = useRouter()
const message = useMessage() // 消息弹窗
@@ -143,8 +157,18 @@ async function handleDelete(id) {
async function getList() {
loading.value = true
try {
const data = await ProductApi.getProductPage(queryParams.value)
tableList.value = data.list
const params = { ...queryParams.value }
if (params.productCategory && params.productCategory.length) {
params.productCategory = params.productCategory.at(-1)
}
const data = await ProductApi.getProductPage(params)
tableList.value = data.list.map((prod) => ({
...prod,
properties: prod.productSpecList[0].properties.map((item) => ({
propertyId: item.propertyId,
label: item.propertyName
}))
}))
total.value = data.total
} finally {
loading.value = false
@@ -163,6 +187,15 @@ function handleQuery() {
getList()
}
async function getOptions() {
BrandApi.getSimpleBrandList().then((data) => {
opts.value.brand = data || []
})
CategoryApi.getCategorySimpleList().then((data) => {
opts.value.productCategory = handleTree(data || [])
})
}
/** 重置按钮操作 */
function resetQuery() {
queryParams.value = {
@@ -182,7 +215,7 @@ function resetQuery() {
*/
function openForm(id) {
// 修改
if (typeof id == 'number') {
if (id) {
push({
path: '/miniMall/productEdit',
query: { id }
@@ -201,6 +234,10 @@ watch(
)
handleQuery()
onMounted(() => {
getOptions()
})
</script>
<style lang="scss" scoped>

130
src/views/MiniMall/Purchase/Comp/DialogAdd.vue
View File

@@ -1,27 +1,27 @@
<template>
<Dialog title="发起采购" v-model="dialogVisible" width="800px">
<el-form :model="form" ref="addForm" :rules="rules" label-width="100px">
<el-form :model="form" ref="formRef" :rules="rules" label-width="100px">
<el-row :gutter="20">
<el-col :span="12" :offset="0">
<el-form-item label="产品" prop="product">
<el-select v-model="form.product" placeholder="请选择" filterable style="width: 100%">
<el-form-item label="产品" prop="productId">
<el-select v-model="form.productId" placeholder="请选择" filterable style="width: 100%">
<el-option
v-for="item in productOptions"
:key="item.value"
:label="item.label"
:value="item.value"
v-for="item in props.opts.product"
:key="item.productId"
:label="item.productName"
:value="item.productId"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12" :offset="0">
<el-form-item label="规格" prop="specs">
<el-select v-model="form.specs" placeholder="请选择" filterable style="width: 100%">
<el-form-item label="规格" prop="specsId">
<el-select v-model="form.specsId" placeholder="请选择" filterable style="width: 100%">
<el-option
v-for="item in specsOptions"
:key="item.value"
:label="item.label"
:value="item.value"
v-for="item in specOptions"
:key="item.specsId"
:label="item.specsName"
:value="item.specsId"
/>
</el-select>
</el-form-item>
@@ -30,34 +30,41 @@
<el-row :gutter="20">
<el-col :span="12" :offset="0">
<el-form-item label="供应商" prop="supplier">
<el-input v-model="form.supplier" placeholder="请输入" />
<el-select v-model="form.supplier" placeholder="选择供应商" filterable>
<el-option
v-for="item in opts.supplier"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12" :offset="0">
<el-form-item label="采购数量" prop="purchaseCount">
<el-input-number
:min="1"
v-model="form.purchaseCount"
placeholder="请输入"
style="width: 100%"
/>
<el-form-item label="采购数量" prop="num">
<el-input-number :min="1" v-model="form.num" placeholder="请输入" style="width: 100%" />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12" :offset="0">
<el-form-item label="采购单价" prop="price">
<el-form-item label="采购单价" prop="unitPrice">
<el-input-number
:min="0"
v-model="form.price"
v-model="form.unitPrice"
placeholder="请输入"
style="width: 100%"
/>
</el-form-item>
</el-col>
<el-col :span="12" :offset="0">
<el-form-item label="存放仓库" prop="warehouse">
<el-select v-model="form.warehouse" placeholder="请选择" filterable style="width: 100%">
<el-form-item label="存放仓库" prop="warehouseId">
<el-select
v-model="form.warehouseId"
placeholder="请选择"
filterable
style="width: 100%"
>
<el-option
v-for="item in warehouseOptions"
:key="item.value"
@@ -86,13 +93,42 @@
</template>
<script setup>
import * as PurchaseApi from '@/api/mall/purchase'
const props = defineProps({
opts: {
type: Object,
default: () => {
return {
product: [],
spec: [],
supplier: []
}
}
}
})
const specOptions = computed(() => {
if (form.value.productId) {
return (
props.opts.product.find((it) => it.productId == form.value.productId)?.productSpecList || []
)
} else {
return []
}
})
const dialogVisible = ref(false) // 弹窗的是否展示
const form = ref()
const rules = ref({})
const form = ref({})
const rules = {
productId: { required: true, message: '产品不可为空', trigger: 'change' },
specsId: { required: true, message: '规格不可为空', trigger: 'change' },
supplier: { required: true, message: '供应商不可为空', trigger: 'change' },
warehouseId: { required: true, message: '仓库不可为空', trigger: 'change' },
num: { required: true, message: '采购数量不可为空', trigger: 'change,blur' },
unitPrice: { required: true, message: '采购单价不可为空', trigger: 'change,blur' }
}
const productOptions = ref([])
const specsOptions = ref([])
const warehouseOptions = ref([
{ label: '自营仓', value: 1 },
{ label: '供应商仓', value: 2 }
@@ -100,19 +136,37 @@ const warehouseOptions = ref([
const open = (val) => {
dialogVisible.value = true
form.value = val || {
product: '',
specs: '',
supplier: '',
purchaseCount: 1,
warehouse: 1,
remark: ''
form.value = { ...val } || {
productId: undefined,
specsId: undefined,
supplier: undefined,
num: undefined,
unitPrice: undefined,
warehouseId: undefined,
remark: undefined
}
}
defineExpose({ open }) // 提供 open 方法，用于打开弹窗
function handleSave() {
console.log('保存')
const formRef = ref()
const formLoading = ref(false)
async function handleSave() {
// 校验表单
if (!formRef.value) return
const valid = await formRef.value.validate()
if (!valid) return
// 提交请求
formLoading.value = true
try {
await PurchaseApi.createPurchase(form.value)
message.success(t('common.createSuccess'))
dialogVisible.value = false
// 发送操作成功的事件
emit('success')
} finally {
formLoading.value = false
}
}
</script>

114
src/views/MiniMall/Purchase/Comp/DialogAudit.vue
View File

@@ -1,11 +1,11 @@
<template>
<Dialog title="采购审核" v-model="dialogVisible" width="800px">
<Descriptions :data="form" :schema="schema" :columns="3" />
<el-form v-if="canEdit" :model="form" ref="auditForm" :rules="rules" label-width="80px">
<el-form v-if="canEdit" :model="form" ref="auditForm" label-width="80px">
<el-row :gutter="20">
<el-col :span="24" :offset="0">
<el-form-item label="审核" prop="status">
<el-radio-group v-model="form.status">
<el-form-item label="审核" prop="isPass">
<el-radio-group v-model="form.isPass">
<el-radio :label="2">通过</el-radio>
<el-radio :label="3">驳回</el-radio>
</el-radio-group>
@@ -29,74 +29,31 @@
</Dialog>
</template>
<script setup>
<script setup name="DialogAuditPurchase">
const dialogVisible = ref(false) // 弹窗的是否展示
const form = ref({})
const rules = ref({})
const canEdit = ref(true)
const schema = ref([
{
field: 'name',
label: '产品名称'
},
{
field: 'specsName',
label: '规格名称'
},
{
field: 'supplier',
label: '供应商'
},
{
field: 'purchaseCount',
label: '采购数量'
},
{
field: 'unitPrice',
label: '采购单价'
},
{
field: 'totalPrice',
label: '总金额'
},
{
field: 'warehouse',
label: '仓库'
},
{
field: 'warehouse',
label: '申请人'
},
{
field: '',
label: '申请时间'
},
{
field: 'remark',
label: '备注',
isEditor: true,
span: 3
}
])
const schema = ref([])
const open = (val, flag) => {
dialogVisible.value = true
form.value = { ...val, status: 2, remark: '<p style="color: red;">哈哈哈</p>' }
form.value = { ...val }
canEdit.value = flag
resetSchema()
if (!canEdit.value) {
const arr = [
{
field: 'status',
field: 'auditStatusName',
label: '采购状态'
},
{
field: 'auditUser',
field: 'checkUserName',
label: '审核人'
},
{
field: 'auditTime',
field: 'checkTime',
label: '审核时间'
},
{
@@ -107,10 +64,61 @@ const open = (val, flag) => {
}
]
schema.value = [...schema.value, ...arr]
} else {
form.value.isPass = 2
form.value.auditRemark = ''
}
}
defineExpose({ open }) // 提供 open 方法，用于打开弹窗
const resetSchema = () => {
schema.value = [
{
field: 'productName',
label: '产品名称'
},
{
field: 'specsName',
label: '规格名称'
},
{
field: 'supplier',
label: '供应商'
},
{
field: 'num',
label: '采购数量'
},
{
field: 'unitPrice',
label: '采购单价'
},
{
field: 'totalPrice',
label: '总金额'
},
{
field: 'warehouseName',
label: '仓库'
},
{
field: 'applyUserName',
label: '申请人'
},
{
field: 'applyTime',
label: '申请时间',
dateFormat: 'YYYY-MM-DD'
},
{
field: 'remark',
label: '备注',
isEditor: true,
span: 3
}
]
}
function handleSave() {
console.log('保存')
}

16
src/views/MiniMall/Purchase/index.data.js
View File

@@ -1,4 +1,3 @@
// import { CrudSchema } from '@/hooks/web/useCrudSchemas'
import { dateFormatter } from '@/utils/formatTime'
const statusOptions = [
@@ -7,11 +6,10 @@ const statusOptions = [
{ label: '已驳回', value: 3 }
]
// CrudSchema：https://doc.iocoder.cn/vue3/crud-schema/
const crudSchemas = reactive([
{
label: '产品名称',
field: 'name',
field: 'productName',
isSearch: true,
isTable: true
},
@@ -29,7 +27,7 @@ const crudSchemas = reactive([
},
{
label: '采购数量',
field: 'purchaseCount',
field: 'num',
isSearch: false,
isTable: true
},
@@ -47,7 +45,7 @@ const crudSchemas = reactive([
},
{
label: '仓库',
field: 'warehouse',
field: 'warehouseName',
isSearch: false,
isTable: true
},
@@ -79,13 +77,13 @@ const crudSchemas = reactive([
},
{
label: '审核人',
field: 'auditUserName',
field: 'checkUserName',
isSearch: true,
isTable: true
},
{
label: '审核时间',
field: 'auditTime',
field: 'checkTime',
isSearch: true,
isTable: true,
formatter: dateFormatter,
@@ -105,7 +103,7 @@ const crudSchemas = reactive([
},
{
label: '采购状态',
field: 'status',
field: 'auditStatus',
isSearch: true,
isTable: true,
search: {
@@ -119,7 +117,7 @@ const crudSchemas = reactive([
}
},
table: {
field: 'statusName',
field: 'auditStatusName',
fixed: 'right'
}
},

172
src/views/MiniMall/Purchase/index.vue
View File

@@ -1,22 +1,76 @@
<template>
<div>
<!-- 搜索工作栏 -->
<Search :schema="allSchemas.searchSchema" labelWidth="0">
<template #actionMore>
<el-form inline :model="queryParams" class="-mb-15px" label-width="0">
<el-form-item>
<el-select
v-model="queryParams.productId"
placeholder="选择产品"
clearable
filterable
@change="changeProd"
>
<el-option
v-for="item in opts.product"
:key="item.productId"
:label="item.productName"
:value="item.productId"
/>
</el-select>
</el-form-item>
<el-form-item>
<el-select
v-model="queryParams.specsId"
placeholder="选择规格"
clearable
filterable
:disabled="!queryParams.productId"
>
<el-option
v-for="item in opts.spec"
:key="item.specsId"
:label="item.specsName"
:value="item.specsId"
/>
</el-select>
</el-form-item>
<el-form-item>
<el-select v-model="queryParams.supplier" placeholder="供应商" clearable filterable>
<el-option
v-for="item in opts.supplier"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item>
<el-date-picker
v-model="queryParams.applyTime"
type="daterange"
range-separator="-"
start-placeholder="申请时间"
end-placeholder="申请时间"
/>
</el-form-item>
<el-form-item>
<el-date-picker
v-model="queryParams.checkTime"
type="daterange"
range-separator="-"
start-placeholder="审核时间"
end-placeholder="审核时间"
/>
</el-form-item>
<el-form-item>
<el-button @click="getList" v-hasPermi="['mall:purchase:search']"> 搜索 </el-button>
<el-button @click="resetQuery" v-hasPermi="['mall:purchase:reset']"> 重置 </el-button>
<el-button type="primary" @click="handleAdd" v-hasPermi="['mall:purchase:add']">
发起采购
</el-button>
</template>
</Search>
</el-form-item>
</el-form>
<!-- 列表 -->
<SSTable
class="mt-20px"
v-model:tableObject="tableObject"
:tableColumns="allSchemas.tableColumns"
@get-list="getTableList"
>
<el-table v-loading="loading" class="mt-20px" :data="tableList" border>
<el-table-column
v-for="item in allSchemas.tableColumns"
:key="item.table?.field || item.field"
@@ -24,6 +78,7 @@
:label="item.label"
:fixed="item.fixed"
min-width="150px"
:formatter="item.formatter"
showOverflowTooltip
/>
<el-table-column label="操作" width="150px" fixed="right">
@@ -56,53 +111,89 @@
</el-button>
</template>
</el-table-column>
</SSTable>
<DialogAdd ref="creatPurchase" />
</el-table>
<!-- 分页 -->
<Pagination
v-model:limit="queryParams.pageSize"
v-model:page="queryParams.pageNo"
:total="total"
@pagination="getList"
/>
<DialogAdd :opts="opts" ref="creatPurchase" />
<DialogAudit ref="auditPurchase" />
</div>
</template>
<script setup>
<script setup name="Purchase">
import * as ProductApi from '@/api/mall/product'
import { allSchemas } from './index.data.js'
import DialogAdd from './Comp/DialogAdd.vue'
import DialogAudit from './Comp/DialogAudit.vue'
import * as PurchaseApi from '@/api/mall/purchase'
import { getDictOptions } from '@/utils/dict'
const creatPurchase = ref()
const auditPurchase = ref()
const tableObject = ref({
tableList: [],
loading: false,
total: 1,
pageSize: 20,
currentPage: 1
const opts = ref({
product: [],
spec: [],
supplier: []
})
const tableList = ref([])
const loading = ref(false)
const total = ref(0)
const queryParams = ref({
productId: undefined,
specsId: undefined,
supplier: undefined,
applyTime: [],
checkTime: [],
pageNo: 1,
pageSize: 20
})
function getOptions() {
ProductApi.getSimpleProductList().then((data) => {
opts.value.product = data
})
opts.value.supplier = getDictOptions('erp_supplier')
}
function changeProd(val) {
if (val) {
opts.value.spec = opts.value.product.find((it) => it.productId == val).productSpecList
} else {
opts.value.spec = []
}
queryParams.value.specsId = undefined
}
function resetQuery() {
queryParams.value = {
productName: undefined,
productBrand: undefined,
productCategory: undefined,
productId: undefined,
specsId: undefined,
supplier: undefined,
applyTime: [],
checkTime: [],
pageNo: 1,
pageSize: 10
pageSize: 20
}
getList()
}
const getList = function () {
tableObject.value.tableList = [
{ name: '测试', status: 1, statusName: '审核中', supplier: '林氏木业', purchaseCount: 10 },
{ name: '测试2', status: 2, statusName: '已通过', supplier: '张氏木业', purchaseCount: 1 },
{ name: '测试3', status: 3, statusName: '已驳回', supplier: '周氏木业', purchaseCount: 5 }
]
}
function getTableList() {
tableObject.value.tableList = [
{ name: '测试', status: 1, statusName: '审核中', supplier: '林氏木业', purchaseCount: 10 },
{ name: '测试2', status: 2, statusName: '已通过', supplier: '张氏木业', purchaseCount: 1 },
{ name: '测试3', status: 3, statusName: '已驳回', supplier: '周氏木业', purchaseCount: 5 }
]
const getList = async function () {
loading.value = true
try {
const data = await PurchaseApi.getPurchasePage(queryParams.value)
tableList.value = data.list
total.value = data.total
} finally {
loading.value = false
}
}
function purchaseAgain(row) {
@@ -119,6 +210,11 @@ function handleAdd() {
function handleDetail(row) {
auditPurchase.value.open({ ...row }, false)
}
onMounted(() => {
getOptions()
getList()
})
</script>
<style lang="scss" scoped></style>