czg_team
/
cashier-web
7
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: 商品列表-报损-售罄-库存预警

This commit is contained in:
duan 2025-03-17 16:06:51 +08:00
parent f403426164
commit e97424262b
5 changed files with 182 additions and 257 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
src/api/product/index.ts
View File

@ -71,6 +71,29 @@ const AuthAPI = {
params
});
},
// 报损
reportDamage(data: any) {
return request<any, Responseres>({
url: `${baseURL}/reportDamage`,
method: "post",
data,
});
},
// 库存预警
stockWarning(data: any) {
return request<any, Responseres>({
url: `${baseURL}/stockWarning?warnLine=${data}`,
method: "post",
});
},
// 售罄
markIsSoldOut(data: any) {
return request<any, Responseres>({
url: `${baseURL}/markIsSoldOut`,
method: "post",
data,
});
}
};

283
src/components/CURD/PageContent.vue
View File

@ -8,58 +8,37 @@
<template v-if="typeof item === 'string'">
<!-- 新增 -->
<template v-if="item === 'add'">
<el-button
v-hasPerm="[`${contentConfig.pageName}:${item}`]"
type="primary"
icon="plus"
@click="handleToolbar(item)"
>
<el-button v-hasPerm="[`${contentConfig.pageName}:${item}`]" type="primary" icon="plus"
@click="handleToolbar(item)">
新增
</el-button>
</template>
<!-- 删除 -->
<template v-else-if="item === 'delete'">
<el-button
v-hasPerm="[`${contentConfig.pageName}:${item}`]"
type="danger"
icon="delete"
:disabled="removeIds.length === 0"
@click="handleToolbar(item)"
>
<el-button v-hasPerm="[`${contentConfig.pageName}:${item}`]" type="danger" icon="delete"
:disabled="removeIds.length === 0" @click="handleToolbar(item)">
删除
</el-button>
</template>
<!-- 导入 -->
<template v-else-if="item === 'import'">
<el-button
v-hasPerm="[`${contentConfig.pageName}:${item}`]"
type="default"
icon="upload"
@click="handleToolbar(item)"
>
<el-button v-hasPerm="[`${contentConfig.pageName}:${item}`]" type="default" icon="upload"
@click="handleToolbar(item)">
导入
</el-button>
</template>
<!-- 导出 -->
<template v-else-if="item === 'export'">
<el-button
v-hasPerm="[`${contentConfig.pageName}:${item}`]"
type="default"
icon="download"
@click="handleToolbar(item)"
>
<el-button v-hasPerm="[`${contentConfig.pageName}:${item}`]" type="default" icon="download"
@click="handleToolbar(item)">
导出
</el-button>
</template>
</template>
<!-- 其他 -->
<template v-else-if="typeof item === 'object'">
<el-button
v-hasPerm="[`${contentConfig.pageName}:${item.auth}`]"
:icon="item.icon"
:type="item.type ?? 'default'"
@click="handleToolbar(item.name)"
>
<el-button v-hasPerm="[`${contentConfig.pageName}:${item.auth}`]" :icon="item.icon"
:type="item.type ?? 'default'" @click="handleToolbar(item.name)">
{{ item.text }}
</el-button>
</template>
@ -88,68 +67,36 @@
</template>
<!-- 导出 -->
<template v-else-if="item === 'exports'">
<el-button
v-hasPerm="[`${contentConfig.pageName}:export`]"
icon="download"
circle
title="导出"
@click="handleToolbar(item)"
/>
<el-button v-hasPerm="[`${contentConfig.pageName}:export`]" icon="download" circle title="导出"
@click="handleToolbar(item)" />
</template>
<!-- 导入 -->
<template v-else-if="item === 'imports'">
<el-button
v-hasPerm="[`${contentConfig.pageName}:import`]"
icon="upload"
circle
title="导入"
@click="handleToolbar(item)"
/>
<el-button v-hasPerm="[`${contentConfig.pageName}:import`]" icon="upload" circle title="导入"
@click="handleToolbar(item)" />
</template>
<!-- 搜索 -->
<template v-else-if="item === 'search'">
<el-button
v-hasPerm="[`${contentConfig.pageName}:query`]"
icon="search"
circle
title="搜索"
@click="handleToolbar(item)"
/>
<el-button v-hasPerm="[`${contentConfig.pageName}:query`]" icon="search" circle title="搜索"
@click="handleToolbar(item)" />
</template>
</template>
<!-- 其他 -->
<template v-else-if="typeof item === 'object'">
<template v-if="item.auth">
<el-button
v-hasPerm="[`${contentConfig.pageName}:${item.auth}`]"
:icon="item.icon"
circle
:title="item.title"
@click="handleToolbar(item.name)"
/>
<el-button v-hasPerm="[`${contentConfig.pageName}:${item.auth}`]" :icon="item.icon" circle
:title="item.title" @click="handleToolbar(item.name)" />
</template>
<template v-else>
<el-button
:icon="item.icon"
circle
:title="item.title"
@click="handleToolbar(item.name)"
/>
<el-button :icon="item.icon" circle :title="item.title" @click="handleToolbar(item.name)" />
</template>
</template>
</template>
</div>
</div>
<!-- 列表 -->
<el-table
ref="tableRef"
v-loading="loading"
v-bind="contentConfig.table"
:data="pageData"
:row-key="pk"
@selection-change="handleSelectionChange"
@filter-change="handleFilterChange"
>
<el-table ref="tableRef" v-loading="loading" v-bind="contentConfig.table" :data="pageData" :row-key="pk"
@selection-change="handleSelectionChange" @filter-change="handleFilterChange">
<template v-for="col in cols" :key="col">
<el-table-column v-if="col.show" v-bind="col">
<template #default="scope">
@ -158,24 +105,15 @@
<template v-if="col.prop">
<template v-if="Array.isArray(scope.row[col.prop])">
<template v-for="(item, index) in scope.row[col.prop]" :key="item">
<el-image
:src="item"
:preview-src-list="scope.row[col.prop]"
:initial-index="index"
:preview-teleported="true"
:style="`width: ${col.imageWidth ?? 40}px; height: ${
col.imageHeight ?? 40
}px`"
/>
<el-image :src="item" :preview-src-list="scope.row[col.prop]" :initial-index="index"
:preview-teleported="true" :style="`width: ${col.imageWidth ?? 40}px; height: ${col.imageHeight ?? 40
}px`" />
</template>
</template>
<template v-else>
<el-image
:src="scope.row[col.prop]"
:preview-src-list="[scope.row[col.prop]]"
<el-image :src="scope.row[col.prop]" :preview-src-list="[scope.row[col.prop]]"
:preview-teleported="true"
:style="`width: ${col.imageWidth ?? 40}px; height: ${col.imageHeight ?? 40}px`"
/>
:style="`width: ${col.imageWidth ?? 40}px; height: ${col.imageHeight ?? 40}px`" />
</template>
</template>
</template>
@ -197,30 +135,20 @@
<template v-else-if="col.templet === 'switch'">
<template v-if="col.prop">
<!-- pageData.length>0: 解决el-switch组件会在表格初始化的时候触发一次change事件 -->
<el-switch
v-model="scope.row[col.prop]"
:active-value="col.activeValue ?? 1"
:inactive-value="col.inactiveValue ?? 0"
:inline-prompt="true"
:active-text="col.activeText ?? ''"
:inactive-text="col.inactiveText ?? ''"
:validate-event="false"
:disabled="!hasAuth(`${contentConfig.pageName}:modify`)"
@change="
<el-switch v-model="scope.row[col.prop]" :active-value="col.activeValue ?? 1"
:inactive-value="col.inactiveValue ?? 0" :inline-prompt="true" :active-text="col.activeText ?? ''"
:inactive-text="col.inactiveText ?? ''" :validate-event="false"
:disabled="!hasAuth(`${contentConfig.pageName}:modify`)" @change="
pageData.length > 0 && handleModify(col.prop, scope.row[col.prop], scope.row)
"
/>
" />
</template>
</template>
<!-- 生成输入框组件 -->
<template v-else-if="col.templet === 'input'">
<template v-if="col.prop">
<el-input
v-model="scope.row[col.prop]"
:type="col.inputType ?? 'text'"
<el-input v-model="scope.row[col.prop]" :type="col.inputType ?? 'text'"
:disabled="!hasAuth(`${contentConfig.pageName}:modify`)"
@blur="handleModify(col.prop, scope.row[col.prop], scope.row)"
/>
@blur="handleModify(col.prop, scope.row[col.prop], scope.row)" />
</template>
</template>
<!-- 格式化为价格 -->
@ -252,7 +180,7 @@
{{
scope.row[col.prop]
? useDateFormat(scope.row[col.prop], col.dateFormat ?? "YYYY-MM-DD HH:mm:ss")
.value
.value
: ""
}}
</template>
@ -263,63 +191,44 @@
<template v-if="typeof item === 'string'">
<!-- 编辑/删除 -->
<template v-if="item === 'edit' || item === 'delete'">
<el-button
v-hasPerm="[`${contentConfig.pageName}:${item}`]"
:type="item === 'edit' ? 'primary' : 'danger'"
:icon="item"
size="small"
link
@click="
<el-button v-hasPerm="[`${contentConfig.pageName}:${item}`]"
:type="item === 'edit' ? 'primary' : 'danger'" :icon="item" size="small" link @click="
handleOperat({
name: item,
row: scope.row,
column: scope.column,
$index: scope.$index,
})
"
>
">
{{ item === "edit" ? "编辑" : "删除" }}
</el-button>
</template>
</template>
<!-- 其他 -->
<template v-else-if="typeof item === 'object'">
<el-dropdown>
<el-button
v-if="item.render === undefined || item.render(scope.row)"
v-bind="
item.auth ? { 'v-hasPerm': [`${contentConfig.pageName}:${item.auth}`] } : {}
"
:icon="item.icon"
:type="item.type ?? 'primary'"
size="small"
link
@click="
<el-dropdown style="margin-top: 4px;">
<el-button v-if="item.render === undefined || item.render(scope.row)" v-bind="item.auth ? { 'v-hasPerm': [`${contentConfig.pageName}:${item.auth}`] } : {}
" :icon="item.icon" :type="item.type ?? 'primary'" size="small" link @click="
handleOperat({
name: item.name,
row: scope.row,
column: scope.column,
$index: scope.$index,
})
"
>
">
{{ item.text }}
</el-button>
<template #dropdown v-if="item.options && item.options.length > 0">
<el-dropdown-menu>
<el-dropdown-item
@click="
handleOperat({
name: item.name,
row: scope.row,
column: scope.column,
$index: scope.$index,
command: opt.command ? opt.command : '',
})
"
v-for="opt in item.options"
:key="opt.value"
>
<el-dropdown-item @click="
handleOperat({
name: item.name,
row: scope.row,
column: scope.column,
$index: scope.$index,
command: opt.command ? opt.command : '',
})
" v-for="opt in item.options" :key="opt.value">
{{ opt.label }}
</el-dropdown-item>
</el-dropdown-menu>
@ -340,33 +249,18 @@
<template v-if="showPagination">
<el-scrollbar>
<div class="mt-[12px]">
<el-pagination
v-bind="pagination"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
/>
<el-pagination v-bind="pagination" @size-change="handleSizeChange" @current-change="handleCurrentChange" />
</div>
</el-scrollbar>
</template>
<!-- 导出弹窗 -->
<el-dialog
v-model="exportsModalVisible"
:align-center="true"
title="导出数据"
width="600px"
style="padding-right: 0"
@close="handleCloseExportsModal"
>
<el-dialog v-model="exportsModalVisible" :align-center="true" title="导出数据" width="600px" style="padding-right: 0"
@close="handleCloseExportsModal">
<!-- 滚动 -->
<el-scrollbar max-height="60vh">
<!-- 表单 -->
<el-form
ref="exportsFormRef"
label-width="auto"
style="padding-right: var(--el-dialog-padding-primary)"
:model="exportsFormData"
:rules="exportsFormRules"
>
<el-form ref="exportsFormRef" label-width="auto" style="padding-right: var(--el-dialog-padding-primary)"
:model="exportsFormData" :rules="exportsFormRules">
<el-form-item label="文件名" prop="filename">
<el-input v-model="exportsFormData.filename" clearable />
</el-form-item>
@ -376,16 +270,10 @@
<el-form-item label="数据源" prop="origin">
<el-select v-model="exportsFormData.origin">
<el-option label="当前数据 (当前页的数据)" :value="ExportsOriginEnum.CURRENT" />
<el-option
label="选中数据 (所有选中的数据)"
:value="ExportsOriginEnum.SELECTED"
:disabled="selectionData.length <= 0"
/>
<el-option
label="全量数据 (所有分页的数据)"
:value="ExportsOriginEnum.REMOTE"
:disabled="contentConfig.exportsAction === undefined"
/>
<el-option label="选中数据 (所有选中的数据)" :value="ExportsOriginEnum.SELECTED"
:disabled="selectionData.length <= 0" />
<el-option label="全量数据 (所有分页的数据)" :value="ExportsOriginEnum.REMOTE"
:disabled="contentConfig.exportsAction === undefined" />
</el-select>
</el-form-item>
<el-form-item label="字段" prop="fields">
@ -406,35 +294,17 @@
</template>
</el-dialog>
<!-- 导入弹窗 -->
<el-dialog
v-model="importModalVisible"
:align-center="true"
title="导入数据"
width="600px"
style="padding-right: 0"
@close="handleCloseImportModal"
>
<el-dialog v-model="importModalVisible" :align-center="true" title="导入数据" width="600px" style="padding-right: 0"
@close="handleCloseImportModal">
<!-- 滚动 -->
<el-scrollbar max-height="60vh">
<!-- 表单 -->
<el-form
ref="importFormRef"
label-width="auto"
style="padding-right: var(--el-dialog-padding-primary)"
:model="importFormData"
:rules="importFormRules"
>
<el-form ref="importFormRef" label-width="auto" style="padding-right: var(--el-dialog-padding-primary)"
:model="importFormData" :rules="importFormRules">
<el-form-item label="文件名" prop="files">
<el-upload
ref="uploadRef"
v-model:file-list="importFormData.files"
class="w-full"
<el-upload ref="uploadRef" v-model:file-list="importFormData.files" class="w-full"
accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel"
:drag="true"
:limit="1"
:auto-upload="false"
:on-exceed="handleFileExceed"
>
:drag="true" :limit="1" :auto-upload="false" :on-exceed="handleFileExceed">
<el-icon class="el-icon--upload"><upload-filled /></el-icon>
<div class="el-upload__text">
<span>将文件拖到此处，或</span>
@ -443,13 +313,8 @@
<template #tip>
<div class="el-upload__tip">
*.xlsx / *.xls
<el-link
v-if="contentConfig.importTemplate"
type="primary"
icon="download"
:underline="false"
@click="handleDownloadTemplate"
>
<el-link v-if="contentConfig.importTemplate" type="primary" icon="download" :underline="false"
@click="handleDownloadTemplate">
下载模板
</el-link>
</div>
@ -461,11 +326,7 @@
<!-- 弹窗底部操作按钮 -->
<template #footer>
<div style="padding-right: var(--el-dialog-padding-primary)">
<el-button
type="primary"
:disabled="importFormData.files.length === 0"
@click="handleImportSubmit"
>
<el-button type="primary" :disabled="importFormData.files.length === 0" @click="handleImportSubmit">
确 定
</el-button>
<el-button @click="handleCloseImportModal">取 消</el-button>
@ -941,10 +802,10 @@ function fetchPageData(formData: IObject = {}, isRestart = false) {
.indexAction(
showPagination
? {
[request.pageName]: pagination.currentPage,
[request.limitName]: pagination.pageSize,
...formData,
}
[request.pageName]: pagination.currentPage,
[request.limitName]: pagination.pageSize,
...formData,
}
: formData
)
.then((data) => {

102
src/views/product/index.vue
View File

@ -25,10 +25,26 @@
<el-switch v-model="scope.row[scope.prop]" :active-value="1" :inactive-value="0"
@click="handleSwitchChange(scope.row)"></el-switch>
</template>
<template #sellOut="scope">
<el-switch v-model="scope.row[scope.prop]" :active-value="1" :inactive-value="0"
@click="handleSwitchChangeTwo(scope.row)"></el-switch>
</template>
<template #mobile="scope">
<el-text>{{ scope.row[scope.prop] }}</el-text>
<copy-button v-if="scope.row[scope.prop]" :text="scope.row[scope.prop]" style="margin-left: 2px" />
</template>
<template #consumables="scope">
<span style="color: #4080ff;" v-if="scope.row.consName">
{{ scope.row.consName }}
</span>
<span v-else>
绑定
</span>
<el-icon @click="editOpen" style="cursor: pointer;color: #4080ff;">
<EditPen />
</el-icon>
</template>
</page-content>
<!-- 新增 -->
@ -49,7 +65,21 @@
<MyDialog ref="myDialogRef" @confirm="confirm" title="修改库存预警">
<el-form :model="form">
<el-form-item label="库存预警" label-width="">
<el-input-number v-model="form.num" label="描述文字"></el-input-number>
<el-input-number v-model="form.warnLine" label="描述文字"></el-input-number>
</el-form-item>
</el-form>
</MyDialog>
<!-- 报损 -->
<MyDialog ref="myDialogRefbaosun" @confirm="confirmbaosun" title="修改库存预警">
<el-form :model="form">
<el-form-item label="报损数量" label-width="">
<el-input-number v-model="datas.number" label="描述文字"></el-input-number>
</el-form-item>
<el-form-item label="报损照片" label-width="">
<MultiImageUpload v-model="datas.images" />
</el-form-item>
<el-form-item label="备注" label-width="">
<el-input v-model="datas.remark" type="textarea" />
</el-form-item>
</el-form>
</MyDialog>
@ -63,12 +93,13 @@ import type { IObject, IOperatData } from "@/components/CURD/types";
import usePage from "@/components/CURD/usePage";
import addModalConfig from "./indexconfig/add";
import contentConfig from "./indexconfig/content";
import MultiImageUpload from "@/components/Upload/MultiImageUpload.vue"
import contentConfig2 from "./indexconfig/content2";
import editModalConfig from "./indexconfig/edit";
import searchConfig from "./indexconfig/search";
import MyDialog from "@/components/mycomponents/myDialog.vue";
import Statistics from "./indexconfig/statistics.vue";
import { Search } from '@element-plus/icons-vue'
const {
searchRef,
contentRef,
@ -84,10 +115,18 @@ const {
} = usePage();
const router = useRouter();
let gongjiData = ref({});
let datas = reactive({
number: 0,
remark: "",
images: []
});
function newHandleQueryClick(e: IObject | undefined) {
const filterParams = contentRef.value?.getFilterParams();
contentRef.value?.fetchPageData({ ...e, ...filterParams }, true);
getTongji(e);
}
function editOpen() {
}
// 重置
function handleResetClick2(queryParams: IObject) {
@ -103,7 +142,7 @@ function getTongji(params: IObject | undefined) {
});
}
const form = reactive({
num: "",
warnLine: "",
});
// 新增
async function handleAddClick() {
@ -123,11 +162,22 @@ function handleSwitchChange(data: any) {
};
UserAPI.onOff(obj);
}
// 售罄
function handleSwitchChangeTwo(data: any) {
let obj = {
type: data.type == "sku" ? "sku" : "product",
id: data.id,
isSoldOut: data.isSoldStock,
};
UserAPI.markIsSoldOut(obj);
}
// 编辑
async function handleEditClick(row: IObject) {
router.push({ name: "addgoods", query: { goods_id: row.id } });
}
const myDialogRef = ref(null);
const myDialogRefbaosun = ref(null);
// 其他工具栏
function handleToolbarClick(name: string) {
console.log(name);
@ -136,8 +186,16 @@ function handleToolbarClick(name: string) {
myDialogRef.value.open();
}
}
function confirm() {
console.log(form, "debug");
async function confirm() {
let res = await UserAPI.stockWarning(form.warnLine)
ElMessage.success("成功");
myDialogRef.value.close();
}
async function confirmbaosun() {
let res = await UserAPI.reportDamage(datas)
ElMessage.success("成功");
myDialogRefbaosun.value.close();
}
// 商品规格
function typeFilter(item: any) {
@ -155,37 +213,9 @@ function typeFilter(item: any) {
}
// 其他操作列
async function handleOperatClick(data: IOperatData) {
console.log(data);
// 重置密码
if (data.name === "reset_pwd") {
ElMessageBox.prompt("请输入用户「" + data.row.username + "」的新密码", "重置密码", {
confirmButtonText: "确定",
cancelButtonText: "取消",
}).then(({ value }) => {
if (!value || value.length < 6) {
ElMessage.warning("密码至少需要6位字符，请重新输入");
return false;
}
// UserAPI.resetPassword(data.row.id, value).then(() => {
// ElMessage.success("密码重置成功，新密码是：" + value);
// });
});
} else if (data.name === "detail") {
// 禁用表单编辑
editModalRef.value?.handleDisabled(true);
// 打开抽屉
editModalRef.value?.setModalVisible();
// 修改抽屉标题
editModalConfig.drawer = { ...editModalConfig.drawer, title: "用户详情" };
// 加载部门下拉数据源
// editModalConfig.formItems[2]!.attrs!.data = await DeptAPI.getOptions();
// 加载角色下拉数据源
// editModalConfig.formItems[4]!.options = await RoleAPI.getOptions();
// 根据id获取数据进行填充
// const formData = await UserAPI.getFormData(data.row.id);
// 设置表单数据
// editModalRef.value?.setFormData(formData);
}
datas.productId = data.row.id
myDialogRefbaosun.value.open();
}
const route = useRoute();

27
src/views/product/indexconfig/content.ts
View File

@ -27,7 +27,7 @@ const contentConfig: IContentConfig<UserPageQuery> = {
obj.createEndTime = obj['1']
const res = await UserAPI.getPage(obj);
res.records.forEach((element: any) => {
if (element.type == "single") {
if (element.type != "sku") {
delete element.skuList
}
});
@ -59,13 +59,13 @@ const contentConfig: IContentConfig<UserPageQuery> = {
pk: "id",
toolbar: [
"add",
// {
// icon: "edit",
// text: "库存预警",
// type: "info",
// name: "custom1",
// auth: "import",
// },
{
icon: "edit",
text: "库存预警",
type: "info",
name: "custom1",
auth: "import",
},
],
cols: [
// { type: "selection", width: 50, align: "center" },
@ -77,7 +77,7 @@ const contentConfig: IContentConfig<UserPageQuery> = {
slotName: "type",
},
{ label: "库存", align: "center", prop: "stockNumber" },
{ label: "耗材信息", align: "center", prop: "consName" },
{ label: "耗材信息", align: "center", prop: "consName", slotName: "consumables", templet: "custom", },
{
label: "上架",
align: "center",
@ -85,13 +85,20 @@ const contentConfig: IContentConfig<UserPageQuery> = {
templet: "custom",
slotName: "shangjia",
},
{
label: "售罄",
align: "center",
prop: "isSoldStock",
templet: "custom",
slotName: "sellOut",
},
{
label: "操作",
align: "center",
fixed: "right",
width: 280,
templet: "tool",
operat: ["edit", "delete"],
operat: [{ text: "报损" }, "edit", "delete"],
},
],
};

4
src/views/user/active/indexconfig/Content.vue
View File

@ -45,6 +45,7 @@
</el-form-item>
<el-form-item v-for="(item, index) in datas.DialogForm.couponsList" :label="item.title">
<el-input-number v-model="item.number" min="1" controls-position="right" placeholder="请输入数量" />
<el-button type="" text @click="removegoods(index)">删除</el-button>
</el-form-item>
</template>
</el-form>
@ -96,6 +97,9 @@ onMounted(() => {
getList(res)
})
})
function removegoods(index) {
datas.DialogForm.couponsList.splice(index, 1)
}
function selectShopRes(item) {
item.forEach(ele => {
ele.number = 1