菜单目录调整
This commit is contained in:
weiwei committed
1 parent
e56450e07b
commit
b1ca12c9e3
12 files changed
No files matched your search
@@ -0,0 +1,182 @@
|
||||
<template>
|
||||
<div class="layout-padding">
|
||||
<div class="layout-padding-auto layout-padding-view">
|
||||
<el-row v-show="showSearch">
|
||||
<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
|
||||
<el-form-item label="单据编号" prop="inventoryCode">
|
||||
<el-input placeholder="请输入单据编号" v-model="state.queryForm.inventoryCode" />
|
||||
</el-form-item>
|
||||
<el-form-item label="单据日期" prop="inventoryDate">
|
||||
<el-date-picker
|
||||
type="date"
|
||||
placeholder="请输入单据日期"
|
||||
v-model="state.queryForm.inventoryDate"
|
||||
fomat="YYYY-MM-DD"
|
||||
value-format="YYYY-MM-DD"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="经办人" prop="handlerUserId">
|
||||
<SelectHandlerUser v-model.trim="state.queryForm.handlerUserId" placeholder="请选择经办人" style="width: 200px" />
|
||||
</el-form-item>
|
||||
<!-- <el-form-item label="审批状态" prop="checkStatus">
|
||||
<el-select v-model="state.queryForm.checkStatus" placeholder="请选择审批状态">
|
||||
<el-option :label="item.label" :value="item.value" v-for="(item, index) in check_status" :key="index" />
|
||||
</el-select>
|
||||
</el-form-item>-->
|
||||
<el-form-item>
|
||||
<el-button icon="search" type="primary" @click="getDataList">查询</el-button>
|
||||
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<div class="mb8" style="width: 100%">
|
||||
<el-button
|
||||
icon="folder-add"
|
||||
type="primary"
|
||||
class="ml10"
|
||||
@click="handleClickCreateInventoryRecord()"
|
||||
v-auth="'supermarket_smErpInventoryRecords_add'"
|
||||
>
|
||||
新 增
|
||||
</el-button>
|
||||
<el-button
|
||||
plain
|
||||
:disabled="multiple"
|
||||
icon="Delete"
|
||||
type="primary"
|
||||
v-auth="'supermarket_smErpInventoryRecords_del'"
|
||||
@click="handleDelete(selectObjs)"
|
||||
>
|
||||
删 除
|
||||
</el-button>
|
||||
<right-toolbar
|
||||
v-model:showSearch="showSearch"
|
||||
:export="'supermarket_smErpInventoryRecords_export'"
|
||||
@exportExcel="exportExcel"
|
||||
class="ml10 mr20"
|
||||
style="float: right"
|
||||
@queryTable="getDataList"
|
||||
/>
|
||||
</div>
|
||||
</el-row>
|
||||
|
||||
<el-table
|
||||
:data="state.dataList"
|
||||
v-loading="state.loading"
|
||||
border
|
||||
:cell-style="tableStyle.cellStyle"
|
||||
:header-cell-style="tableStyle.headerCellStyle"
|
||||
@selection-change="selectionChangHandle"
|
||||
@sort-change="sortChangeHandle"
|
||||
>
|
||||
<el-table-column type="selection" width="40" align="center" />
|
||||
<el-table-column type="index" label="#" width="50" />
|
||||
<el-table-column prop="inventoryCode" label="单据编号" show-overflow-tooltip />
|
||||
<el-table-column prop="inventoryDate" label="单据日期" show-overflow-tooltip />
|
||||
<el-table-column prop="inventoryDate" label="入库商品" show-overflow-tooltip />
|
||||
<el-table-column prop="handlerUserName" label="经办人" show-overflow-tooltip />
|
||||
<!-- <el-table-column prop="checkStatus" label="审批状态" show-overflow-tooltip>-->
|
||||
<!-- <template #default="scope">-->
|
||||
<!-- <dict-tag :options="check_status" :value="scope.row.checkStatus"></dict-tag>-->
|
||||
<!-- </template>-->
|
||||
<!-- </el-table-column>-->
|
||||
<el-table-column prop="supplierId" label="货商" show-overflow-tooltip />
|
||||
<el-table-column prop="remark" label="备注" show-overflow-tooltip />
|
||||
<!-- <el-table-column prop="totalAmount" label="入库总金额" show-overflow-tooltip />-->
|
||||
<el-table-column label="操作" width="150">
|
||||
<template #default="scope">
|
||||
<el-button
|
||||
icon="edit-pen"
|
||||
text
|
||||
type="primary"
|
||||
v-auth="'supermarket_smErpInventoryRecords_edit'"
|
||||
@click="handleClickEditInventoryRecord(scope.row.id)"
|
||||
>
|
||||
编辑
|
||||
</el-button>
|
||||
<el-button
|
||||
icon="delete"
|
||||
text
|
||||
type="primary"
|
||||
v-auth="'supermarket_smErpInventoryRecords_del'"
|
||||
@click="handleDelete([scope.row.id])"
|
||||
>
|
||||
删除
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { useRouter } from "vue-router"
|
||||
import { BasicTableProps, useTable } from "/@/hooks/table"
|
||||
import { fetchList, delObjs } from "../../../api/supermarketerp/smErpCgInventory"
|
||||
import { useMessage, useMessageBox } from "/@/hooks/message"
|
||||
import { useDict } from "/@/hooks/dict"
|
||||
|
||||
const router = useRouter()
|
||||
const { erp_order_type, inventory_type, check_status } = useDict("erp_order_type", "inventory_type", "check_status")
|
||||
// 搜索变量
|
||||
const queryRef = ref()
|
||||
const showSearch = ref(true)
|
||||
// 多选变量
|
||||
const selectObjs = ref([]) as any
|
||||
const multiple = ref(true)
|
||||
|
||||
const state: BasicTableProps = reactive<BasicTableProps>({
|
||||
queryForm: {
|
||||
inventoryType: "4",
|
||||
},
|
||||
pageList: fetchList,
|
||||
})
|
||||
|
||||
// table hook
|
||||
const { getDataList, currentChangeHandle, sizeChangeHandle, sortChangeHandle, downBlobFile, tableStyle } = useTable(state)
|
||||
|
||||
// 清空搜索条件
|
||||
const resetQuery = () => {
|
||||
// 清空搜索条件
|
||||
queryRef.value?.resetFields()
|
||||
// 清空多选
|
||||
selectObjs.value = []
|
||||
getDataList()
|
||||
}
|
||||
|
||||
// 导出excel
|
||||
const exportExcel = () => {
|
||||
downBlobFile("/supermarket/smErpInventoryRecords/export", Object.assign(state.queryForm, { ids: selectObjs }), "smErpCgInventory.xlsx")
|
||||
}
|
||||
|
||||
// 多选事件
|
||||
const selectionChangHandle = (objs: { id: string }[]) => {
|
||||
selectObjs.value = objs.map(({ id }) => id)
|
||||
multiple.value = !objs.length
|
||||
}
|
||||
|
||||
// 点击创建出库入库记录表
|
||||
const handleClickCreateInventoryRecord = () => router.push({ path: "/supermarketerp/smErpCgBack/smErpCgBackOption" })
|
||||
// 点击编辑出库入库记录表
|
||||
const handleClickEditInventoryRecord = (id: string) => router.push({ path: "/supermarketerp/smErpCgBack/smErpCgBackOption", query: { id } })
|
||||
|
||||
// 删除操作
|
||||
const handleDelete = async (ids: string[]) => {
|
||||
try {
|
||||
await useMessageBox().confirm("此操作将永久删除")
|
||||
} catch {
|
||||
return
|
||||
}
|
||||
|
||||
try {
|
||||
await delObjs(ids)
|
||||
getDataList()
|
||||
useMessage().success("删除成功")
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg)
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,523 @@
|
||||
<template>
|
||||
<div class="layout-padding">
|
||||
<div v-loading="loading" class="layout-padding-auto layout-padding-view" style="overflow: scroll">
|
||||
<el-form ref="baseDataFormRef" :model="baseDataForm" :rules="dataRules" label-width="100px">
|
||||
<div class="flex flex-wrap">
|
||||
<el-form-item label="单据编号" prop="inventoryCode">
|
||||
<el-input v-model.trim="baseDataForm.inventoryCode" readonly style="width: 200px" />
|
||||
</el-form-item>
|
||||
<el-form-item label="单据日期" prop="inventoryDate">
|
||||
<el-input v-model.trim="baseDataForm.inventoryDate" readonly style="width: 200px" />
|
||||
</el-form-item>
|
||||
<el-form-item label="关联入库单" prop="linkCode">
|
||||
<el-input
|
||||
v-model="baseDataForm.linkCode"
|
||||
:suffix-icon="Search"
|
||||
@click="handleClickLinkCode"
|
||||
readonly
|
||||
placeholder="请选择采购入库单"
|
||||
style="width: 200px"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="经办人" prop="handlerUserId">
|
||||
<SelectHandlerUser v-model.trim="baseDataForm.handlerUserId" placeholder="请选择经办人" style="width: 200px" />
|
||||
</el-form-item>
|
||||
<el-form-item label="货商" prop="supplierId">
|
||||
<select-supplier v-model="baseDataForm.supplierId" style="width: 200px" />
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" prop="remark">
|
||||
<el-input v-model.trim="baseDataForm.remark" placeholder="请输入备注" style="width: 200px" />
|
||||
</el-form-item>
|
||||
</div>
|
||||
</el-form>
|
||||
|
||||
<el-row class="my-3">
|
||||
<el-button @click="addEvent">新增（顶部）</el-button>
|
||||
<el-button @click="pushEvent">新增（尾部）</el-button>
|
||||
<el-button @click="insertEvent">
|
||||
在第
|
||||
<el-input-number
|
||||
@click.stop
|
||||
v-model="state.insertedRowNumber"
|
||||
:min="0"
|
||||
:max="state.editableTableData.length"
|
||||
:precision="0"
|
||||
size="small"
|
||||
controls-position="right"
|
||||
style="min-width: 50px; margin: 0 5px"
|
||||
/>
|
||||
行新增
|
||||
</el-button>
|
||||
<el-button @click="removeSelectRowEvent" :disabled="state.selectedRowsErpSpuIds.length <= 0">删除选中</el-button>
|
||||
<el-button @click="clearData">清空数据</el-button>
|
||||
<el-button @click="handleClickSpuSelect">商品选择</el-button>
|
||||
</el-row>
|
||||
|
||||
<vxe-table
|
||||
ref="editableTableRef"
|
||||
border
|
||||
:loading="loading"
|
||||
show-overflow
|
||||
max-height="400"
|
||||
:edit-config="{
|
||||
trigger: 'click',
|
||||
mode: 'cell',
|
||||
beforeEditMethod({ row, column }:any) {
|
||||
// 禁止编辑
|
||||
if (column.property === '') {
|
||||
return false
|
||||
}
|
||||
return true
|
||||
},
|
||||
}"
|
||||
:column-config="{ resizable: true }"
|
||||
:row-config="{ isHover: true }"
|
||||
:resizable-config="{ dragMode: 'fixed' }"
|
||||
:data="state.editableTableData"
|
||||
:edit-rules="validRules"
|
||||
@checkbox-all="selectChangeEvent"
|
||||
@checkbox-change="selectChangeEvent"
|
||||
size="mini"
|
||||
align="center"
|
||||
>
|
||||
<vxe-column type="checkbox" width="40" fixed="left" />
|
||||
<vxe-column type="seq" width="50" fixed="left" />
|
||||
<vxe-column field="productName" title="库存商品">
|
||||
<template #default="{ row }">
|
||||
<span v-if="row.productName">{{ row.productName }}</span>
|
||||
<span v-else>{{ row.erpSpuId && state.erpSpuSimpleAll.find((item: any) => item.id === row.erpSpuId)?.productName }}</span>
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="unitId" title="包装单位" :edit-render="{}">
|
||||
<template #edit="{ row }">
|
||||
<el-select v-model="row.unitId" placeholder="请选择包装单位">
|
||||
<el-option
|
||||
v-if="row.erpUnitVos?.length > 0"
|
||||
v-for="item in row.erpUnitVos"
|
||||
:key="item.id"
|
||||
:label="item.unit"
|
||||
:value="item.id"
|
||||
/>
|
||||
<el-option v-else :key="row.id" :label="row.unit" :value="row.id" />
|
||||
</el-select>
|
||||
</template>
|
||||
<template #default="{ row }">
|
||||
<span v-if="row.unitId">{{ row.unit ?? row.erpUnitVos?.find((item: any) => item.id == row.unitId)?.unit }}</span>
|
||||
<span v-else style="color: #c0c4cf">请选择</span>
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="quantity" title="数量" :edit-render="{ autoFocus: 'input', placeholder: '请输入' }">
|
||||
<template #edit="{ row }">
|
||||
<el-input v-model="row.quantity" />
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="unitPrice" title="进价">
|
||||
<template #default="{ row }">
|
||||
{{
|
||||
row.purchasePrice
|
||||
? displayPrice(row.purchasePrice)
|
||||
: displayPrice(row.erpUnitVos?.find((item: any) => item.id == row.unitId)?.purchasePrice)
|
||||
}}
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="totalAmount" title="累计总金额">
|
||||
<template #default="{ row }">
|
||||
<span v-if="row.unitId && row.quantity && row.unit && !row.erpUnitVos">
|
||||
{{ displayPrice(row.quantity * parseFloat(row.purchasePrice)) }}
|
||||
</span>
|
||||
<span v-if="row.unitId && row.quantity && row.erpUnitVos">
|
||||
{{ displayPrice(Number(row.erpUnitVos?.find((item: any) => item.id == row.unitId)?.purchasePrice) * row.quantity) }}
|
||||
</span>
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="remark" title="备注" :edit-render="{ autoFocus: 'input', placeholder: '请输入' }">
|
||||
<template #edit="{ row }">
|
||||
<el-input v-model="row.remark" />
|
||||
</template>
|
||||
</vxe-column>
|
||||
</vxe-table>
|
||||
|
||||
<el-row class="my-3">
|
||||
<el-tooltip effect="dark" content="返回列表页面" placement="top">
|
||||
<el-button type="primary" plain @click="router.back()">取消</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip v-if="!baseDataForm.id" effect="dark" content="保存并清空数据" placement="top">
|
||||
<el-button type="primary" plain @click="onContinueAdd">继续添加</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip effect="dark" content="保存并返回列表页面" placement="top">
|
||||
<el-button type="primary" plain @click="onSave">保存</el-button>
|
||||
</el-tooltip>
|
||||
</el-row>
|
||||
|
||||
<!-- 商品选择对话框 -->
|
||||
<erpSpuSelectDialog
|
||||
ref="erpSpuSelectDialogRef"
|
||||
v-model="state.erpSpuSelectDialogVisible"
|
||||
:selectedSpuRows="state.editableTableData"
|
||||
@getSelectedSpuRows="getSelectedSpuRows"
|
||||
/>
|
||||
|
||||
<linkCodeDialog
|
||||
ref="linkCgPlanDialogRef"
|
||||
v-model="state.linkCgPlanDialogVisible"
|
||||
title="关联采购订单"
|
||||
:getTableData="() => getCgInventoryPage({ inventoryType: '3' })"
|
||||
@getSelectedLinkCode="getSelectedLinkCode"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="cgPlanOption">
|
||||
import { ref, reactive, computed, onMounted } from "vue"
|
||||
import { useRouter, useRoute } from "vue-router"
|
||||
import { useMessage } from "/@/hooks/message"
|
||||
import { getObj, addObj, putObj } from "/@/api/supermarketerp/smErpCgBack"
|
||||
import { getPlanCode, getErpSpuSimpleAll } from "/@/api/supermarketerp/common"
|
||||
import { VxeTableEvents, VxeTablePropTypes, type VxeTableInstance } from "vxe-table"
|
||||
import { formatDate } from "/@/utils/formatTime"
|
||||
import { Search } from "@element-plus/icons-vue"
|
||||
import erpSpuSelectDialog from "/@/views/supermarketerp/components/erpSpuSelectDialog.vue"
|
||||
import linkCodeDialog from "../components/linkCodeDialog.vue"
|
||||
import { getCgInventoryPage } from "/@/api/supermarketerp/common"
|
||||
import { displayPrice } from "/@/utils/formatMoney"
|
||||
|
||||
const router = useRouter()
|
||||
const route = useRoute()
|
||||
const loading = ref(false) // 采购计划加载
|
||||
const erpSpuSelectDialogRef = ref() // 商品选择对话框ref
|
||||
const linkCgPlanDialogRef = ref() // 关联采购申请单对话框ref
|
||||
const baseDataFormRef = ref() // 基本数据表单ref
|
||||
const editableTableRef = ref<VxeTableInstance<any>>() // 可编辑表格ref
|
||||
// 基本信息表单数据
|
||||
const baseDataForm = reactive<any>({
|
||||
id: "",
|
||||
inventoryCode: "",
|
||||
inventoryDate: formatDate(new Date(), "YYYY-mm-dd"),
|
||||
handlerUserId: "",
|
||||
checkStatus: "",
|
||||
checkUserId: "",
|
||||
checkTime: "",
|
||||
supplierId: "",
|
||||
remark: "",
|
||||
orderType: "2",
|
||||
totalAmount: "",
|
||||
inventoryType: "4",
|
||||
})
|
||||
const state = reactive<{
|
||||
editableTableData: any[]
|
||||
erpSpuItemsMemo: any[]
|
||||
selectedRowsErpSpuIds: string[]
|
||||
insertedRowNumber: number
|
||||
erpSpuSimpleAll: any
|
||||
linkCodeVisible: boolean
|
||||
erpSpuSelectDialogVisible: boolean
|
||||
linkCgPlanDialogVisible: boolean
|
||||
}>({
|
||||
editableTableData: [], // 可编辑表格数据
|
||||
erpSpuItemsMemo: [], // 请求到的可编辑表格商品数据的缓存
|
||||
selectedRowsErpSpuIds: [], // 可编辑表格已选行的ErpSpuId
|
||||
insertedRowNumber: 0, // 可编辑表格插入行的行号
|
||||
erpSpuSimpleAll: [], // 简要商品列表
|
||||
|
||||
linkCodeVisible: false, // 关联采购申请单对话框开关
|
||||
erpSpuSelectDialogVisible: false, // 商品选择对话框开关
|
||||
linkCgPlanDialogVisible: false, // 关联采购申请单对话框开关
|
||||
})
|
||||
|
||||
// 基本信息表单校验规则
|
||||
const dataRules = ref({
|
||||
inventoryCode: [{ required: true, message: "出入库记录表编号不能为空", trigger: "blur" }],
|
||||
inventoryDate: [{ required: true, message: "出入库记录表单据日期不能为空", trigger: "blur" }],
|
||||
handlerUserId: [{ required: true, message: "经办人不能为空", trigger: "blur" }],
|
||||
supplierId: [{ required: true, message: "货商不能为空", trigger: "blur" }],
|
||||
})
|
||||
|
||||
// 可编辑表格校验规则
|
||||
const validRules = ref<VxeTablePropTypes.EditRules<any>>({
|
||||
unitId: [{ required: true, message: "必须选择" }],
|
||||
quantity: [{ required: true, type: "number", min: 1, max: 99, message: "数值范围1~99" }],
|
||||
})
|
||||
|
||||
// 初始化数据
|
||||
const getInitData = async () => {
|
||||
baseDataForm.id = undefined
|
||||
const id = route.query.id as string
|
||||
if (id) {
|
||||
loading.value = true
|
||||
// 获取采购计划数据 & 获取简要商品列表
|
||||
const [cgPlanData] = await Promise.allSettled([getObj(id)])
|
||||
.then((results) => results.map((result) => (result.status === "fulfilled" ? result.value : null)))
|
||||
.finally(() => (loading.value = false))
|
||||
|
||||
if (cgPlanData && cgPlanData.code === 0) {
|
||||
Object.assign(baseDataForm, cgPlanData.data)
|
||||
state.editableTableData = cgPlanData.data.items
|
||||
state.erpSpuItemsMemo = cgPlanData.data.items
|
||||
}
|
||||
}
|
||||
|
||||
// 获取采购退货编号
|
||||
const [erpSpuSimpleAll, planCode] = await Promise.allSettled([getErpSpuSimpleAll(), getPlanCode({ type: 4 })]).then((results) =>
|
||||
results.map((result) => (result.status === "fulfilled" ? result.value : null)),
|
||||
)
|
||||
erpSpuSimpleAll && erpSpuSimpleAll.code === 0 && (state.erpSpuSimpleAll = erpSpuSimpleAll.data)
|
||||
planCode && planCode.code === 0 && (baseDataForm.inventoryCode = planCode.data)
|
||||
}
|
||||
|
||||
// 点击关联采购申请编号
|
||||
const handleClickLinkCode = () => linkCgPlanDialogRef.value.openLinkCodeDialog()
|
||||
|
||||
// 获取选择的采购申请
|
||||
const getSelectedLinkCode = (selectionRows: any) => {
|
||||
console.log("被选择的关联数据", selectionRows)
|
||||
|
||||
baseDataForm.linkCode = selectionRows.planCode
|
||||
state.editableTableData = selectionRows.items
|
||||
state.erpSpuItemsMemo = selectionRows.items
|
||||
state.linkCgPlanDialogVisible = false
|
||||
}
|
||||
|
||||
// 顶部表格行新增
|
||||
const addEvent = () => {
|
||||
const newRow: any = {
|
||||
id: "",
|
||||
erpSpuId: "",
|
||||
quantity: null,
|
||||
unitPrice: null,
|
||||
totalAmount: null,
|
||||
remark: "",
|
||||
unitId: "",
|
||||
}
|
||||
state.editableTableData.unshift(newRow)
|
||||
nextTick(() => {
|
||||
const $table = editableTableRef.value
|
||||
if ($table) {
|
||||
$table.setEditRow(newRow)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
// 底部表格行新增
|
||||
const pushEvent = () => {
|
||||
const newRow: any = {
|
||||
id: "",
|
||||
erpSpuId: "",
|
||||
quantity: null,
|
||||
unitPrice: null,
|
||||
totalAmount: null,
|
||||
remark: "",
|
||||
unitId: "",
|
||||
}
|
||||
state.editableTableData.push(newRow)
|
||||
nextTick(() => {
|
||||
const $table = editableTableRef.value
|
||||
if ($table) {
|
||||
$table.setEditRow(newRow)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
// 在指定行插入
|
||||
const insertEvent = () => {
|
||||
const newRow: any = {
|
||||
id: "",
|
||||
erpSpuId: "",
|
||||
quantity: null,
|
||||
unitPrice: null,
|
||||
totalAmount: null,
|
||||
remark: "",
|
||||
unitId: "",
|
||||
}
|
||||
state.editableTableData.splice(state.insertedRowNumber, 0, newRow)
|
||||
nextTick(() => {
|
||||
const $table = editableTableRef.value
|
||||
if ($table) {
|
||||
$table.setEditRow(newRow)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
// 删除选中的行
|
||||
const removeSelectRowEvent = () => {
|
||||
const $table = editableTableRef.value
|
||||
if ($table) {
|
||||
const selectRecords = $table.getCheckboxRecords()
|
||||
if (selectRecords.length > 0) {
|
||||
state.editableTableData = state.editableTableData.filter((item) => !selectRecords.some((row) => row.erpSpuId === item.erpSpuId))
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 可编辑表格行勾选
|
||||
const selectChangeEvent: VxeTableEvents.CheckboxChange<any> = ({ checked }) => {
|
||||
const $table = editableTableRef.value
|
||||
if ($table) {
|
||||
const records = $table.getCheckboxRecords()
|
||||
console.log(checked ? "勾选事件" : "取消事件", records)
|
||||
state.selectedRowsErpSpuIds = records.map((item) => item.erpSpuId)
|
||||
}
|
||||
}
|
||||
|
||||
// 点击商品选择
|
||||
const handleClickSpuSelect = () => erpSpuSelectDialogRef.value.openDialog()
|
||||
|
||||
// 获取被选择的商品行
|
||||
const getSelectedSpuRows = (selectionRows: any) => {
|
||||
console.log("被选择的商品行", selectionRows)
|
||||
|
||||
// 筛选新勾选的项
|
||||
const addedItems = selectionRows
|
||||
.filter((item: any) => !state.editableTableData.some((editableTableItem: any) => editableTableItem.erpSpuId === item.erpSpuId))
|
||||
.map((addItem: any) => {
|
||||
const index = state.erpSpuItemsMemo.findIndex((item: any) => item.erpSpuId === addItem.erpSpuId)
|
||||
if (index !== -1) return state.erpSpuItemsMemo[index]
|
||||
return { ...addItem, isNew: true }
|
||||
}) // 为新增的数据项添加isNew，若该项原本已经存在，则不添加isNew
|
||||
// 仅添加新勾选的项
|
||||
state.editableTableData = [...state.editableTableData, ...addedItems]
|
||||
|
||||
// 筛选取消勾选的项
|
||||
const removedItems = state.editableTableData.filter(
|
||||
(item: any) => !selectionRows.some((selectedItem: any) => selectedItem.erpSpuId === item.erpSpuId),
|
||||
)
|
||||
// 仅移除取消勾选的项
|
||||
state.editableTableData = state.editableTableData.filter(
|
||||
(item: any) => !removedItems.some((removeItem: any) => removeItem.erpSpuId === item.erpSpuId),
|
||||
)
|
||||
// state.editableTableData.push(item)
|
||||
// nextTick(() => {
|
||||
// const $table = editableTableRef.value
|
||||
// if ($table) {
|
||||
// $table.setRow(item)
|
||||
// }
|
||||
// })
|
||||
state.erpSpuSelectDialogVisible = false
|
||||
console.log("state.editableTableData", state.editableTableData)
|
||||
}
|
||||
|
||||
// 整理数据
|
||||
const cgPlanSpuItems = computed(() => {
|
||||
return state.editableTableData.map((item: any) => {
|
||||
if (item.erpUnitVos) {
|
||||
const unit = item.erpUnitVos.find((unitItem: any) => unitItem.id === item.unitId)
|
||||
return {
|
||||
id: item.isNew ? undefined : item.id,
|
||||
erpSpuId: item.erpSpuId,
|
||||
quantity: item.quantity,
|
||||
unitPrice: unit.purchasePrice ? Number(unit?.purchasePrice) : 0,
|
||||
totalAmount: Number(unit?.purchasePrice || 0) * item.quantity,
|
||||
remark: item.remark,
|
||||
unitId: item.unitId,
|
||||
}
|
||||
} else {
|
||||
return {
|
||||
id: item.isNew ? undefined : item.id,
|
||||
erpSpuId: item.erpSpuId,
|
||||
quantity: item.quantity,
|
||||
unitPrice: item.purchasePrice ? Number(item.purchasePrice) : 0,
|
||||
totalAmount: item?.purchasePrice && item.quantity ? Number(item.purchasePrice) * item.quantity : 0,
|
||||
remark: item.remark,
|
||||
unitId: item.unitId,
|
||||
}
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
// 点击继续添加
|
||||
const onContinueAdd = async () => {
|
||||
console.log("baseDataForm", baseDataForm)
|
||||
console.log("state.editableTableData", state.editableTableData)
|
||||
;(await baseDataFormValidate()) && checkSelectSpu() && (await editableTableValidate()) && (await submitData()) && clearData()
|
||||
}
|
||||
|
||||
// 点击保存
|
||||
const onSave = async () => {
|
||||
console.log("baseDataForm", baseDataForm)
|
||||
console.log("state.editableTableData", state.editableTableData)
|
||||
;(await baseDataFormValidate()) &&
|
||||
checkSelectSpu() &&
|
||||
(await editableTableValidate()) &&
|
||||
(await submitData()) &&
|
||||
clearData() &&
|
||||
router.replace({ path: "/supermarketerp/smErpCgBack/index" })
|
||||
}
|
||||
|
||||
// 校验基本数据表单 成功返回 true 失败返回 undefined
|
||||
const baseDataFormValidate = async () => {
|
||||
const valid = await baseDataFormRef.value.validate().catch(() => {})
|
||||
return valid
|
||||
}
|
||||
|
||||
// 校验是否选择了商品 成功返回 true 失败返回 false
|
||||
const checkSelectSpu = () => {
|
||||
if (state.editableTableData.length <= 0) {
|
||||
useMessage().warning("请选择商品")
|
||||
return false
|
||||
} else {
|
||||
return true
|
||||
}
|
||||
}
|
||||
|
||||
// 校验可编辑表格 成功返回 true 失败返回 false
|
||||
const editableTableValidate = async () => {
|
||||
// 全量校验
|
||||
const $table = editableTableRef.value
|
||||
if ($table) {
|
||||
const errMap = await $table.validate(true)
|
||||
if (errMap) {
|
||||
console.log("全量校验失败！")
|
||||
return false
|
||||
} else {
|
||||
console.log("全量校验成功！")
|
||||
return true
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 提交数据 成功返回 true 失败返回 false
|
||||
const submitData = async () => {
|
||||
try {
|
||||
loading.value = true
|
||||
|
||||
const _pa = {
|
||||
...baseDataForm,
|
||||
items: cgPlanSpuItems.value,
|
||||
}
|
||||
|
||||
console.log("提交的数据：", _pa)
|
||||
|
||||
const res = baseDataForm.id
|
||||
? await putObj(_pa).finally(() => (loading.value = false))
|
||||
: await addObj(_pa).finally(() => (loading.value = false))
|
||||
if (res.code === 0) {
|
||||
useMessage().success(baseDataForm.id ? "修改成功" : "添加成功")
|
||||
return true
|
||||
} else {
|
||||
useMessage().error(res.msg)
|
||||
return false
|
||||
}
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg)
|
||||
loading.value = false
|
||||
return false
|
||||
}
|
||||
}
|
||||
|
||||
// 清空填写的数据 返回 true
|
||||
const clearData = () => {
|
||||
for (const key in baseDataForm) {
|
||||
if (key === "id" || key === "inventoryCode" || key === "inventoryDate") continue
|
||||
baseDataForm[key] = ""
|
||||
}
|
||||
state.insertedRowNumber = 0
|
||||
state.editableTableData = []
|
||||
state.erpSpuItemsMemo = []
|
||||
state.selectedRowsErpSpuIds = []
|
||||
return true
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
getInitData()
|
||||
})
|
||||
</script>
|
||||
@@ -0,0 +1,138 @@
|
||||
<template>
|
||||
<div class="layout-padding">
|
||||
<div class="layout-padding-auto layout-padding-view">
|
||||
<el-row>
|
||||
<div class="mb8" style="width: 100%">
|
||||
<el-button icon="folder-add" type="primary" class="ml10" @click="handleClickCreateCgPlan" v-auth="'supermarket_smErpCgDd_add'">
|
||||
新 增
|
||||
</el-button>
|
||||
<el-button
|
||||
plain
|
||||
:disabled="multiple"
|
||||
icon="Delete"
|
||||
type="primary"
|
||||
v-auth="'supermarket_smErpCgDd_del'"
|
||||
@click="handleDelete(selectObjs)"
|
||||
>
|
||||
删 除
|
||||
</el-button>
|
||||
<right-toolbar
|
||||
v-model:showSearch="showSearch"
|
||||
:export="'supermarket_smErpCgDd_export'"
|
||||
@exportExcel="exportExcel"
|
||||
class="ml10 mr20"
|
||||
style="float: right"
|
||||
@queryTable="getDataList"
|
||||
/>
|
||||
</div>
|
||||
</el-row>
|
||||
|
||||
<el-table
|
||||
:data="state.dataList"
|
||||
v-loading="state.loading"
|
||||
border
|
||||
:cell-style="tableStyle.cellStyle"
|
||||
:header-cell-style="tableStyle.headerCellStyle"
|
||||
@selection-change="selectionChangHandle"
|
||||
@sort-change="sortChangeHandle"
|
||||
>
|
||||
<el-table-column type="selection" width="40" align="center" />
|
||||
<el-table-column type="index" label="#" width="40" />
|
||||
<el-table-column prop="code" label="编号" show-overflow-tooltip />
|
||||
<el-table-column prop="ddDate" label="单据日期" show-overflow-tooltip />
|
||||
<el-table-column prop="productName" label="商品信息" show-overflow-tooltip />
|
||||
<el-table-column prop="handlerUserName" label="经办人" show-overflow-tooltip />
|
||||
<!-- <el-table-column prop="checkStatus" label="审批状态" show-overflow-tooltip>-->
|
||||
<!-- <template #default="scope">-->
|
||||
<!-- <dict-tag :options="check_status" :value="scope.row.checkStatus" />-->
|
||||
<!-- </template>-->
|
||||
<!-- </el-table-column>-->
|
||||
<!-- <el-table-column prop="totalAmount" label="金额合计" show-overflow-tooltip /> -->
|
||||
<el-table-column prop="supplierId" label="货商" show-overflow-tooltip />
|
||||
<el-table-column prop="remark" label="备注" show-overflow-tooltip />
|
||||
<el-table-column label="操作" width="150">
|
||||
<template #default="scope">
|
||||
<el-button
|
||||
icon="edit-pen"
|
||||
text
|
||||
type="primary"
|
||||
v-auth="'supermarket_smErpCgDd_edit'"
|
||||
@click="handleClickEditCgPlan(scope.row.id)"
|
||||
>
|
||||
编辑
|
||||
</el-button>
|
||||
<el-button icon="delete" text type="primary" v-auth="'supermarket_smErpCgDd_del'" @click="handleDelete([scope.row.id])">
|
||||
删除
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="index">
|
||||
import { useRouter } from "vue-router"
|
||||
import { BasicTableProps, useTable } from "/@/hooks/table"
|
||||
import { fetchList, delObjs } from "/@/api/supermarketerp/smErpCgDd"
|
||||
import { useMessage, useMessageBox } from "/@/hooks/message"
|
||||
import { useDict } from "/@/hooks/dict"
|
||||
|
||||
const router = useRouter()
|
||||
const { check_status } = useDict("check_status")
|
||||
const showSearch = ref(true)
|
||||
// 多选变量
|
||||
const selectObjs = ref([]) as any
|
||||
const multiple = ref(true)
|
||||
|
||||
const state: BasicTableProps = reactive<BasicTableProps>({
|
||||
queryForm: {},
|
||||
pageList: fetchList,
|
||||
})
|
||||
|
||||
// table hook
|
||||
const { getDataList, currentChangeHandle, sizeChangeHandle, sortChangeHandle, downBlobFile, tableStyle } = useTable(state)
|
||||
|
||||
// 清空搜索条件
|
||||
// const resetQuery = () => {
|
||||
// // 清空搜索条件
|
||||
// queryRef.value?.resetFields()
|
||||
// // 清空多选
|
||||
// selectObjs.value = []
|
||||
// getDataList()
|
||||
// }
|
||||
|
||||
// 导出excel
|
||||
const exportExcel = () => {
|
||||
downBlobFile("/supermarket/smErpCgDd/export", Object.assign(state.queryForm, { ids: selectObjs }), "smErpCgDd.xlsx")
|
||||
}
|
||||
|
||||
// 多选事件
|
||||
const selectionChangHandle = (objs: { id: string }[]) => {
|
||||
selectObjs.value = objs.map(({ id }) => id)
|
||||
multiple.value = !objs.length
|
||||
}
|
||||
|
||||
// 点击创建采购清单
|
||||
const handleClickCreateCgPlan = () => router.push({ path: "/supermarketerp/smErpCgDd/smErpCgDdOption" })
|
||||
// 点击编辑采购清单
|
||||
const handleClickEditCgPlan = (id: string) => router.push({ path: "/supermarketerp/smErpCgDd/smErpCgDdOption", query: { id } })
|
||||
|
||||
// 删除操作
|
||||
const handleDelete = async (ids: string[]) => {
|
||||
try {
|
||||
await useMessageBox().confirm("此操作将永久删除")
|
||||
} catch {
|
||||
return
|
||||
}
|
||||
|
||||
try {
|
||||
await delObjs(ids)
|
||||
getDataList()
|
||||
useMessage().success("删除成功")
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg)
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,530 @@
|
||||
<template>
|
||||
<div class="layout-padding">
|
||||
<div v-loading="loading" class="layout-padding-auto layout-padding-view" style="overflow: scroll">
|
||||
<el-form ref="baseDataFormRef" :model="baseDataForm" :rules="dataRules" label-width="100px">
|
||||
<div class="flex flex-wrap">
|
||||
<el-form-item label="编号" prop="code">
|
||||
<el-input v-model="baseDataForm.code" readonly style="width: 200px" />
|
||||
</el-form-item>
|
||||
<el-form-item label="单据日期" prop="dDate">
|
||||
<el-input v-model="baseDataForm.ddDate" readonly style="width: 200px" />
|
||||
</el-form-item>
|
||||
<el-form-item label="经办人" prop="handlerUserId">
|
||||
<SelectHandlerUser v-model.trim="baseDataForm.handlerUserId" placeholder="请选择经办人" style="width: 200px" />
|
||||
</el-form-item>
|
||||
<el-form-item label="关联补货申请" prop="linkCode">
|
||||
<el-input
|
||||
v-model="baseDataForm.linkCode"
|
||||
:suffix-icon="Search"
|
||||
@click="handleClickLinkCode"
|
||||
readonly
|
||||
placeholder="请选择补货申请单"
|
||||
style="width: 200px"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="审批状态" prop="checkStatus">
|
||||
<el-select v-model="baseDataForm.checkStatus" placeholder="请选择审批状态" style="width: 200px">
|
||||
<el-option :label="item.label" :value="item.value" v-for="(item, index) in check_status" :key="index" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="货商" prop="supplierId">
|
||||
<select-supplier v-model="baseDataForm.supplierId" style="width: 200px" />
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" prop="remark">
|
||||
<el-input v-model="baseDataForm.remark" placeholder="请输入备注" style="width: 200px" />
|
||||
</el-form-item>
|
||||
</div>
|
||||
</el-form>
|
||||
|
||||
<el-row class="my-3">
|
||||
<el-button @click="addEvent">新增（顶部）</el-button>
|
||||
<el-button @click="pushEvent">新增（尾部）</el-button>
|
||||
<el-button @click="insertEvent">
|
||||
在第
|
||||
<el-input-number
|
||||
@click.stop
|
||||
v-model="state.insertedRowNumber"
|
||||
:min="0"
|
||||
:max="state.editableTableData.length"
|
||||
:precision="0"
|
||||
size="small"
|
||||
controls-position="right"
|
||||
style="min-width: 50px; margin: 0 5px"
|
||||
/>
|
||||
行新增
|
||||
</el-button>
|
||||
<el-button @click="removeSelectRowEvent" :disabled="state.selectedRowsErpSpuIds.length <= 0">删除选中</el-button>
|
||||
<el-button @click="clearData">清空数据</el-button>
|
||||
<el-button @click="handleClickSpuSelect">商品选择</el-button>
|
||||
</el-row>
|
||||
|
||||
<vxe-table
|
||||
ref="editableTableRef"
|
||||
border
|
||||
:loading="loading"
|
||||
show-overflow
|
||||
max-height="400"
|
||||
:edit-config="{
|
||||
trigger: 'click',
|
||||
mode: 'cell',
|
||||
beforeEditMethod({ row, column }:any) {
|
||||
// 禁止编辑
|
||||
if (column.property === '') {
|
||||
return false
|
||||
}
|
||||
return true
|
||||
},
|
||||
}"
|
||||
:column-config="{ resizable: true }"
|
||||
:row-config="{ isHover: true }"
|
||||
:resizable-config="{ dragMode: 'fixed' }"
|
||||
:data="state.editableTableData"
|
||||
:edit-rules="validRules"
|
||||
@checkbox-all="selectChangeEvent"
|
||||
@checkbox-change="selectChangeEvent"
|
||||
size="mini"
|
||||
align="center"
|
||||
>
|
||||
<vxe-column type="checkbox" width="40" fixed="left" />
|
||||
<vxe-column type="seq" width="50" fixed="left" />
|
||||
<vxe-column field="productName" title="库存商品">
|
||||
<template #default="{ row }">
|
||||
<span v-if="row.productName">{{ row.productName }}</span>
|
||||
<span v-else>{{ row.erpSpuId && state.erpSpuSimpleAll.find((item: any) => item.id === row.erpSpuId)?.productName }}</span>
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="unitId" title="包装单位" :edit-render="{}">
|
||||
<template #edit="{ row }">
|
||||
<el-select v-model="row.unitId" placeholder="请选择包装单位">
|
||||
<el-option
|
||||
v-if="row.erpUnitVos?.length > 0"
|
||||
v-for="item in row.erpUnitVos"
|
||||
:key="item.id"
|
||||
:label="item.unit"
|
||||
:value="item.id"
|
||||
/>
|
||||
<el-option v-else :key="row.id" :label="row.unit" :value="row.id" />
|
||||
</el-select>
|
||||
</template>
|
||||
<template #default="{ row }">
|
||||
<span v-if="row.unitId">{{ row.unit ?? row.erpUnitVos?.find((item: any) => item.id == row.unitId)?.unit }}</span>
|
||||
<span v-else style="color: #c0c4cf">请选择</span>
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="quantity" title="数量" :edit-render="{ autoFocus: 'input', placeholder: '请输入' }">
|
||||
<template #edit="{ row }">
|
||||
<el-input v-model="row.quantity" />
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="purchasePrice" title="进价">
|
||||
<template #default="{ row }">
|
||||
{{
|
||||
row.purchasePrice
|
||||
? displayPrice(row.purchasePrice)
|
||||
: displayPrice(row.erpUnitVos?.find((item: any) => item.id == row.unitId)?.purchasePrice)
|
||||
}}
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="totalAmount" title="累计总金额">
|
||||
<template #default="{ row }">
|
||||
<span v-if="row.unitId && row.quantity && row.unit && !row.erpUnitVos">
|
||||
{{ displayPrice(row.quantity * parseFloat(row.purchasePrice)) }}
|
||||
</span>
|
||||
<span v-if="row.unitId && row.quantity && row.erpUnitVos">
|
||||
{{ displayPrice(Number(row.erpUnitVos?.find((item: any) => item.id == row.unitId)?.purchasePrice) * row.quantity) }}
|
||||
</span>
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="remark" title="备注" :edit-render="{ autoFocus: 'input', placeholder: '请输入' }">
|
||||
<template #edit="{ row }">
|
||||
<el-input v-model="row.remark" />
|
||||
</template>
|
||||
</vxe-column>
|
||||
</vxe-table>
|
||||
|
||||
<el-row class="my-3">
|
||||
<el-tooltip effect="dark" content="返回列表页面" placement="top">
|
||||
<el-button type="primary" plain @click="router.back()">取消</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip v-if="!baseDataForm.id" effect="dark" content="保存并清空数据" placement="top">
|
||||
<el-button type="primary" plain @click="onContinueAdd">继续添加</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip effect="dark" content="保存并返回列表页面" placement="top">
|
||||
<el-button type="primary" plain @click="onSave">保存</el-button>
|
||||
</el-tooltip>
|
||||
</el-row>
|
||||
|
||||
<!-- 商品选择对话框 -->
|
||||
<erpSpuSelectDialog
|
||||
ref="erpSpuSelectDialogRef"
|
||||
v-model="state.erpSpuSelectDialogVisible"
|
||||
:selectedSpuRows="state.editableTableData"
|
||||
@getSelectedSpuRows="getSelectedSpuRows"
|
||||
/>
|
||||
|
||||
<linkCodeDialog
|
||||
ref="linkCgPlanDialogRef"
|
||||
v-model="state.linkCgPlanDialogVisible"
|
||||
title="关联补货申请"
|
||||
:getTableData="getCgsqPage"
|
||||
@getSelectedLinkCode="getSelectedLinkCode"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="smErpCgDd">
|
||||
import { ref, reactive, computed, onMounted } from "vue"
|
||||
import { useRouter, useRoute } from "vue-router"
|
||||
import { useMessage } from "/@/hooks/message"
|
||||
import { getObj, addObj, putObj } from "/@/api/supermarketerp/smErpCgDd"
|
||||
import { getPlanCode, getErpSpuSimpleAll } from "/@/api/supermarketerp/common"
|
||||
import { VxeTableEvents, VxeTablePropTypes, type VxeTableInstance } from "vxe-table"
|
||||
import { formatDate } from "/@/utils/formatTime"
|
||||
import { Search } from "@element-plus/icons-vue"
|
||||
import erpSpuSelectDialog from "/@/views/supermarketerp/components/erpSpuSelectDialog.vue"
|
||||
import linkCodeDialog from "../components/linkCodeDialog.vue"
|
||||
import { getCgsqPage } from "/@/api/supermarketerp/smErpCgDd"
|
||||
import { displayPrice } from "/@/utils/formatMoney"
|
||||
import { useDict } from "/@/hooks/dict"
|
||||
|
||||
const router = useRouter()
|
||||
const route = useRoute()
|
||||
const loading = ref(false) // 采购计划加载
|
||||
const erpSpuSelectDialogRef = ref() // 商品选择对话框ref
|
||||
const linkCgPlanDialogRef = ref() // 关联采购申请单对话框ref
|
||||
const baseDataFormRef = ref() // 基本数据表单ref
|
||||
const editableTableRef = ref<VxeTableInstance<any>>() // 可编辑表格ref
|
||||
const { check_status } = useDict("check_status")
|
||||
// 基本信息表单数据
|
||||
const baseDataForm = reactive<any>({
|
||||
id: "",
|
||||
code: "",
|
||||
ddDate: formatDate(new Date(), "YYYY-mm-dd"),
|
||||
warehouseId: "",
|
||||
handlerUserId: "",
|
||||
linkCode: "",
|
||||
checkStatus: "",
|
||||
checkUserId: "",
|
||||
totalNumber: "",
|
||||
totalAmount: "",
|
||||
supplierId: "",
|
||||
remark: "",
|
||||
orderNumber: "",
|
||||
})
|
||||
const state = reactive<{
|
||||
editableTableData: any[]
|
||||
erpSpuItemsMemo: any[]
|
||||
selectedRowsErpSpuIds: string[]
|
||||
insertedRowNumber: number
|
||||
erpSpuSimpleAll: any
|
||||
linkCodeVisible: boolean
|
||||
erpSpuSelectDialogVisible: boolean
|
||||
linkCgPlanDialogVisible: boolean
|
||||
}>({
|
||||
editableTableData: [], // 可编辑表格数据
|
||||
erpSpuItemsMemo: [], // 请求到的可编辑表格商品数据的缓存
|
||||
selectedRowsErpSpuIds: [], // 可编辑表格已选行的ErpSpuId
|
||||
insertedRowNumber: 0, // 可编辑表格插入行的行号
|
||||
erpSpuSimpleAll: [], // 简要商品列表
|
||||
linkCodeVisible: false, // 关联采购申请单对话框开关
|
||||
erpSpuSelectDialogVisible: false, // 商品选择对话框开关
|
||||
linkCgPlanDialogVisible: false, // 关联采购申请单对话框开关
|
||||
})
|
||||
|
||||
// 基本信息表单校验规则
|
||||
const dataRules = ref({
|
||||
code: [{ required: true, message: "采购订单编号不能为空", trigger: "blur" }],
|
||||
ddDate: [{ required: true, message: "采购订单单据日期不能为空", trigger: "blur" }],
|
||||
handlerUserId: [{ required: true, message: "经办人不能为空", trigger: "blur" }],
|
||||
supplierId: [{ required: true, message: "货商不能为空", trigger: "blur" }],
|
||||
})
|
||||
|
||||
// 可编辑表格校验规则
|
||||
const validRules = ref<VxeTablePropTypes.EditRules<any>>({
|
||||
unitId: [{ required: true, message: "必须选择" }],
|
||||
quantity: [{ required: true, type: "number", min: 1, max: 99, message: "数值范围1~99" }],
|
||||
})
|
||||
|
||||
// 初始化数据
|
||||
const getInitData = async () => {
|
||||
baseDataForm.id = undefined
|
||||
const id = route.query.id as string
|
||||
if (id) {
|
||||
loading.value = true
|
||||
// 获取采购计划数据 & 获取简要商品列表
|
||||
const [cgPlanData] = await Promise.allSettled([getObj(id)])
|
||||
.then((results) => results.map((result) => (result.status === "fulfilled" ? result.value : null)))
|
||||
.finally(() => (loading.value = false))
|
||||
|
||||
if (cgPlanData && cgPlanData.code === 0) {
|
||||
Object.assign(baseDataForm, cgPlanData.data)
|
||||
state.editableTableData = cgPlanData.data.items
|
||||
state.erpSpuItemsMemo = cgPlanData.data.items
|
||||
}
|
||||
}
|
||||
|
||||
// 获取采购订单编号
|
||||
const [erpSpuSimpleAll, planCode] = await Promise.allSettled([getErpSpuSimpleAll(), getPlanCode({ type: 2 })]).then((results) =>
|
||||
results.map((result) => (result.status === "fulfilled" ? result.value : null)),
|
||||
)
|
||||
erpSpuSimpleAll && erpSpuSimpleAll.code === 0 && (state.erpSpuSimpleAll = erpSpuSimpleAll.data)
|
||||
planCode && planCode.code === 0 && (baseDataForm.code = planCode.data)
|
||||
}
|
||||
|
||||
// 点击关联采购申请编号
|
||||
const handleClickLinkCode = () => linkCgPlanDialogRef.value.openLinkCodeDialog()
|
||||
|
||||
// 获取选择的采购申请
|
||||
const getSelectedLinkCode = (selectionRows: any) => {
|
||||
console.log("被选择的关联数据", selectionRows)
|
||||
|
||||
baseDataForm.linkCode = selectionRows.planCode
|
||||
state.editableTableData = selectionRows.items
|
||||
state.erpSpuItemsMemo = selectionRows.items
|
||||
state.linkCgPlanDialogVisible = false
|
||||
}
|
||||
|
||||
// 顶部表格行新增
|
||||
const addEvent = () => {
|
||||
const newRow: any = {
|
||||
id: "",
|
||||
erpSpuId: "",
|
||||
quantity: null,
|
||||
unitPrice: null,
|
||||
totalAmount: null,
|
||||
remark: "",
|
||||
unitId: "",
|
||||
}
|
||||
state.editableTableData.unshift(newRow)
|
||||
nextTick(() => {
|
||||
const $table = editableTableRef.value
|
||||
if ($table) {
|
||||
$table.setEditRow(newRow)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
// 底部表格行新增
|
||||
const pushEvent = () => {
|
||||
const newRow: any = {
|
||||
id: "",
|
||||
erpSpuId: "",
|
||||
quantity: null,
|
||||
unitPrice: null,
|
||||
totalAmount: null,
|
||||
remark: "",
|
||||
unitId: "",
|
||||
}
|
||||
state.editableTableData.push(newRow)
|
||||
nextTick(() => {
|
||||
const $table = editableTableRef.value
|
||||
if ($table) {
|
||||
$table.setEditRow(newRow)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
// 在指定行插入
|
||||
const insertEvent = () => {
|
||||
const newRow: any = {
|
||||
id: "",
|
||||
erpSpuId: "",
|
||||
quantity: null,
|
||||
unitPrice: null,
|
||||
totalAmount: null,
|
||||
remark: "",
|
||||
unitId: "",
|
||||
}
|
||||
state.editableTableData.splice(state.insertedRowNumber, 0, newRow)
|
||||
nextTick(() => {
|
||||
const $table = editableTableRef.value
|
||||
if ($table) {
|
||||
$table.setEditRow(newRow)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
// 删除选中的行
|
||||
const removeSelectRowEvent = () => {
|
||||
const $table = editableTableRef.value
|
||||
if ($table) {
|
||||
const selectRecords = $table.getCheckboxRecords()
|
||||
if (selectRecords.length > 0) {
|
||||
state.editableTableData = state.editableTableData.filter((item) => !selectRecords.some((row) => row.erpSpuId === item.erpSpuId))
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 可编辑表格行勾选
|
||||
const selectChangeEvent: VxeTableEvents.CheckboxChange<any> = ({ checked }) => {
|
||||
const $table = editableTableRef.value
|
||||
if ($table) {
|
||||
const records = $table.getCheckboxRecords()
|
||||
console.log(checked ? "勾选事件" : "取消事件", records)
|
||||
state.selectedRowsErpSpuIds = records.map((item) => item.erpSpuId)
|
||||
}
|
||||
}
|
||||
|
||||
// 点击商品选择
|
||||
const handleClickSpuSelect = () => erpSpuSelectDialogRef.value.openDialog()
|
||||
|
||||
// 获取被选择的商品行
|
||||
const getSelectedSpuRows = (selectionRows: any) => {
|
||||
console.log("被选择的商品行", selectionRows)
|
||||
|
||||
// 筛选新勾选的项
|
||||
const addedItems = selectionRows
|
||||
.filter((item: any) => !state.editableTableData.some((editableTableItem: any) => editableTableItem.erpSpuId === item.erpSpuId))
|
||||
.map((addItem: any) => {
|
||||
const index = state.erpSpuItemsMemo.findIndex((item: any) => item.erpSpuId === addItem.erpSpuId)
|
||||
if (index !== -1) return state.erpSpuItemsMemo[index]
|
||||
return { ...addItem, isNew: true }
|
||||
}) // 为新增的数据项添加isNew，若该项原本已经存在，则不添加isNew
|
||||
// 仅添加新勾选的项
|
||||
state.editableTableData = [...state.editableTableData, ...addedItems]
|
||||
|
||||
// 筛选取消勾选的项
|
||||
const removedItems = state.editableTableData.filter(
|
||||
(item: any) => !selectionRows.some((selectedItem: any) => selectedItem.erpSpuId === item.erpSpuId),
|
||||
)
|
||||
// 仅移除取消勾选的项
|
||||
state.editableTableData = state.editableTableData.filter(
|
||||
(item: any) => !removedItems.some((removeItem: any) => removeItem.erpSpuId === item.erpSpuId),
|
||||
)
|
||||
// state.editableTableData.push(item)
|
||||
// nextTick(() => {
|
||||
// const $table = editableTableRef.value
|
||||
// if ($table) {
|
||||
// $table.setRow(item)
|
||||
// }
|
||||
// })
|
||||
state.erpSpuSelectDialogVisible = false
|
||||
console.log("state.editableTableData", state.editableTableData)
|
||||
}
|
||||
|
||||
// 整理数据
|
||||
const cgPlanSpuItems = computed(() => {
|
||||
return state.editableTableData.map((item: any) => {
|
||||
if (item.erpUnitVos) {
|
||||
const unit = item.erpUnitVos.find((unitItem: any) => unitItem.id === item.unitId)
|
||||
return {
|
||||
id: item.isNew ? undefined : item.id,
|
||||
erpSpuId: item.erpSpuId,
|
||||
quantity: item.quantity,
|
||||
unitPrice: unit.purchasePrice ? Number(unit?.purchasePrice) : 0,
|
||||
totalAmount: Number(unit?.purchasePrice || 0) * item.quantity,
|
||||
remark: item.remark,
|
||||
unitId: item.unitId,
|
||||
}
|
||||
} else {
|
||||
return {
|
||||
id: item.isNew ? undefined : item.id,
|
||||
erpSpuId: item.erpSpuId,
|
||||
quantity: item.quantity,
|
||||
unitPrice: item.purchasePrice ? Number(item.purchasePrice) : 0,
|
||||
totalAmount: item?.purchasePrice && item.quantity ? Number(item.purchasePrice) * item.quantity : 0,
|
||||
remark: item.remark,
|
||||
unitId: item.unitId,
|
||||
}
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
// 点击继续添加
|
||||
const onContinueAdd = async () => {
|
||||
console.log("baseDataForm", baseDataForm)
|
||||
console.log("state.editableTableData", state.editableTableData)
|
||||
;(await baseDataFormValidate()) && checkSelectSpu() && (await editableTableValidate()) && (await submitData()) && clearData()
|
||||
}
|
||||
|
||||
// 点击保存
|
||||
const onSave = async () => {
|
||||
console.log("baseDataForm", baseDataForm)
|
||||
console.log("state.editableTableData", state.editableTableData)
|
||||
;(await baseDataFormValidate()) &&
|
||||
checkSelectSpu() &&
|
||||
(await editableTableValidate()) &&
|
||||
(await submitData()) &&
|
||||
clearData() &&
|
||||
router.replace({ path: "/supermarketerp/smErpCgDd/index" })
|
||||
}
|
||||
|
||||
// 校验基本数据表单 成功返回 true 失败返回 undefined
|
||||
const baseDataFormValidate = async () => {
|
||||
const valid = await baseDataFormRef.value.validate().catch(() => {})
|
||||
return valid
|
||||
}
|
||||
|
||||
// 校验是否选择了商品 成功返回 true 失败返回 false
|
||||
const checkSelectSpu = () => {
|
||||
if (state.editableTableData.length <= 0) {
|
||||
useMessage().warning("请选择商品")
|
||||
return false
|
||||
} else {
|
||||
return true
|
||||
}
|
||||
}
|
||||
|
||||
// 校验可编辑表格 成功返回 true 失败返回 false
|
||||
const editableTableValidate = async () => {
|
||||
// 全量校验
|
||||
const $table = editableTableRef.value
|
||||
if ($table) {
|
||||
const errMap = await $table.validate(true)
|
||||
if (errMap) {
|
||||
console.log("全量校验失败！")
|
||||
return false
|
||||
} else {
|
||||
console.log("全量校验成功！")
|
||||
return true
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 提交数据 成功返回 true 失败返回 false
|
||||
const submitData = async () => {
|
||||
try {
|
||||
loading.value = true
|
||||
|
||||
const _pa = {
|
||||
...baseDataForm,
|
||||
items: cgPlanSpuItems.value,
|
||||
}
|
||||
|
||||
console.log("提交的数据：", _pa)
|
||||
|
||||
const res = baseDataForm.id
|
||||
? await putObj(_pa).finally(() => (loading.value = false))
|
||||
: await addObj(_pa).finally(() => (loading.value = false))
|
||||
if (res.code === 0) {
|
||||
useMessage().success(baseDataForm.id ? "修改成功" : "添加成功")
|
||||
return true
|
||||
} else {
|
||||
useMessage().error(res.msg)
|
||||
return false
|
||||
}
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg)
|
||||
loading.value = false
|
||||
return false
|
||||
}
|
||||
}
|
||||
|
||||
// 清空填写的数据 返回 true
|
||||
const clearData = () => {
|
||||
for (const key in baseDataForm) {
|
||||
if (key === "code" || key === "id" || key === "dDate") continue
|
||||
baseDataForm[key] = ""
|
||||
}
|
||||
state.insertedRowNumber = 0
|
||||
state.editableTableData = []
|
||||
state.erpSpuItemsMemo = []
|
||||
state.selectedRowsErpSpuIds = []
|
||||
return true
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
getInitData()
|
||||
})
|
||||
</script>
|
||||
@@ -0,0 +1,183 @@
|
||||
<template>
|
||||
<div class="layout-padding">
|
||||
<div class="layout-padding-auto layout-padding-view">
|
||||
<el-row v-show="showSearch">
|
||||
<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
|
||||
<el-form-item label="单据编号" prop="inventoryCode">
|
||||
<el-input placeholder="请输入单据编号" v-model="state.queryForm.inventoryCode" />
|
||||
</el-form-item>
|
||||
<el-form-item label="单据日期" prop="inventoryDate">
|
||||
<el-date-picker
|
||||
type="date"
|
||||
placeholder="请输入单据日期"
|
||||
v-model="state.queryForm.inventoryDate"
|
||||
fomat="YYYY-MM-DD"
|
||||
value-format="YYYY-MM-DD"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="经办人" prop="handlerUserId">
|
||||
<SelectHandlerUser v-model.trim="state.queryForm.handlerUserId" placeholder="请选择经办人" style="width: 200px" />
|
||||
</el-form-item>
|
||||
<el-form-item label="审批状态" prop="checkStatus">
|
||||
<el-select v-model="state.queryForm.checkStatus" placeholder="请选择审批状态">
|
||||
<el-option :label="item.label" :value="item.value" v-for="(item, index) in check_status" :key="index" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button icon="search" type="primary" @click="getDataList">查询</el-button>
|
||||
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<div class="mb8" style="width: 100%">
|
||||
<el-button
|
||||
icon="folder-add"
|
||||
type="primary"
|
||||
class="ml10"
|
||||
@click="handleClickCreateInventoryRecord()"
|
||||
v-auth="'supermarket_smErpInventoryRecords_add'"
|
||||
>
|
||||
新 增
|
||||
</el-button>
|
||||
<el-button
|
||||
plain
|
||||
:disabled="multiple"
|
||||
icon="Delete"
|
||||
type="primary"
|
||||
v-auth="'supermarket_smErpInventoryRecords_del'"
|
||||
@click="handleDelete(selectObjs)"
|
||||
>
|
||||
删 除
|
||||
</el-button>
|
||||
<right-toolbar
|
||||
v-model:showSearch="showSearch"
|
||||
:export="'supermarket_smErpInventoryRecords_export'"
|
||||
@exportExcel="exportExcel"
|
||||
class="ml10 mr20"
|
||||
style="float: right"
|
||||
@queryTable="getDataList"
|
||||
/>
|
||||
</div>
|
||||
</el-row>
|
||||
|
||||
<el-table
|
||||
:data="state.dataList"
|
||||
v-loading="state.loading"
|
||||
border
|
||||
:cell-style="tableStyle.cellStyle"
|
||||
:header-cell-style="tableStyle.headerCellStyle"
|
||||
@selection-change="selectionChangHandle"
|
||||
@sort-change="sortChangeHandle"
|
||||
>
|
||||
<el-table-column type="selection" width="40" align="center" />
|
||||
<el-table-column type="index" label="#" width="50" />
|
||||
<el-table-column prop="inventoryCode" label="单据编号" show-overflow-tooltip />
|
||||
<el-table-column prop="inventoryDate" label="单据日期" show-overflow-tooltip />
|
||||
<el-table-column prop="productName" label="入库商品" show-overflow-tooltip />
|
||||
<el-table-column prop="handlerUserName" label="经办人" show-overflow-tooltip />
|
||||
<!-- <el-table-column prop="checkStatus" label="审批状态" show-overflow-tooltip>-->
|
||||
<!-- <template #default="scope">-->
|
||||
<!-- <dict-tag :options="check_status" :value="scope.row.checkStatus"></dict-tag>-->
|
||||
<!-- </template>-->
|
||||
<!-- </el-table-column>-->
|
||||
<el-table-column prop="supplierId" label="货商" show-overflow-tooltip />
|
||||
<el-table-column prop="remark" label="备注" show-overflow-tooltip />
|
||||
<el-table-column prop="totalAmount" label="入库总金额" show-overflow-tooltip />
|
||||
<el-table-column label="操作" width="150">
|
||||
<template #default="scope">
|
||||
<el-button
|
||||
icon="edit-pen"
|
||||
text
|
||||
type="primary"
|
||||
v-auth="'supermarket_smErpInventoryRecords_edit'"
|
||||
@click="handleClickEditInventoryRecord(scope.row.id)"
|
||||
>
|
||||
编辑
|
||||
</el-button>
|
||||
<el-button
|
||||
icon="delete"
|
||||
text
|
||||
type="primary"
|
||||
v-auth="'supermarket_smErpInventoryRecords_del'"
|
||||
@click="handleDelete([scope.row.id])"
|
||||
>
|
||||
删除
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { useRouter } from "vue-router"
|
||||
import { BasicTableProps, useTable } from "/@/hooks/table"
|
||||
import { fetchList, delObjs } from "../../../api/supermarketerp/smErpCgInventory"
|
||||
import { useMessage, useMessageBox } from "/@/hooks/message"
|
||||
import { useDict } from "/@/hooks/dict"
|
||||
|
||||
const router = useRouter()
|
||||
const { erp_order_type, inventory_type, check_status } = useDict("erp_order_type", "inventory_type", "check_status")
|
||||
// 搜索变量
|
||||
const queryRef = ref()
|
||||
const showSearch = ref(true)
|
||||
// 多选变量
|
||||
const selectObjs = ref([]) as any
|
||||
const multiple = ref(true)
|
||||
|
||||
const state: BasicTableProps = reactive<BasicTableProps>({
|
||||
queryForm: {
|
||||
inventoryType: "3",
|
||||
},
|
||||
pageList: fetchList,
|
||||
})
|
||||
|
||||
// table hook
|
||||
const { getDataList, currentChangeHandle, sizeChangeHandle, sortChangeHandle, downBlobFile, tableStyle } = useTable(state)
|
||||
|
||||
// 清空搜索条件
|
||||
const resetQuery = () => {
|
||||
// 清空搜索条件
|
||||
queryRef.value?.resetFields()
|
||||
// 清空多选
|
||||
selectObjs.value = []
|
||||
getDataList()
|
||||
}
|
||||
|
||||
// 导出excel
|
||||
const exportExcel = () => {
|
||||
downBlobFile("/supermarket/smErpInventoryRecords/export", Object.assign(state.queryForm, { ids: selectObjs }), "smErpCgInventory.xlsx")
|
||||
}
|
||||
|
||||
// 多选事件
|
||||
const selectionChangHandle = (objs: { id: string }[]) => {
|
||||
selectObjs.value = objs.map(({ id }) => id)
|
||||
multiple.value = !objs.length
|
||||
}
|
||||
|
||||
// 点击创建出库入库记录表
|
||||
const handleClickCreateInventoryRecord = () => router.push({ path: "/supermarketerp/smErpCgInventory/smErpCgInventoryOption" })
|
||||
// 点击编辑出库入库记录表
|
||||
const handleClickEditInventoryRecord = (id: string) =>
|
||||
router.push({ path: "/supermarketerp/smErpCgInventory/smErpCgInventoryOption", query: { id } })
|
||||
|
||||
// 删除操作
|
||||
const handleDelete = async (ids: string[]) => {
|
||||
try {
|
||||
await useMessageBox().confirm("此操作将永久删除")
|
||||
} catch {
|
||||
return
|
||||
}
|
||||
|
||||
try {
|
||||
await delObjs(ids)
|
||||
getDataList()
|
||||
useMessage().success("删除成功")
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg)
|
||||
}
|
||||
}
|
||||
</script>
|
||||
+530
@@ -0,0 +1,530 @@
|
||||
<template>
|
||||
<div class="layout-padding">
|
||||
<div v-loading="loading" class="layout-padding-auto layout-padding-view" style="overflow: scroll">
|
||||
<el-form ref="baseDataFormRef" :model="baseDataForm" :rules="dataRules" label-width="100px">
|
||||
<div class="flex flex-wrap">
|
||||
<el-form-item label="单据编号" prop="inventoryCode">
|
||||
<el-input v-model.trim="baseDataForm.inventoryCode" readonly style="width: 200px" />
|
||||
</el-form-item>
|
||||
<el-form-item label="单据日期" prop="inventoryDate">
|
||||
<el-input v-model.trim="baseDataForm.inventoryDate" readonly style="width: 200px" />
|
||||
</el-form-item>
|
||||
<el-form-item label="关联采购订单" prop="linkCode">
|
||||
<el-input
|
||||
v-model="baseDataForm.linkCode"
|
||||
:suffix-icon="Search"
|
||||
@click="handleClickLinkCode"
|
||||
readonly
|
||||
placeholder="请选择采购订单"
|
||||
style="width: 200px"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="经办人" prop="handlerUserId">
|
||||
<SelectHandlerUser v-model.trim="baseDataForm.handlerUserId" placeholder="请选择经办人" style="width: 200px" />
|
||||
</el-form-item>
|
||||
<el-form-item label="审批状态" prop="checkStatus">
|
||||
<el-select v-model="baseDataForm.checkStatus" placeholder="请选择审批状态" style="width: 200px">
|
||||
<el-option :label="item.label" :value="item.value" v-for="(item, index) in check_status" :key="index" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="货商" prop="supplierId">
|
||||
<select-supplier v-model="baseDataForm.supplierId" style="width: 200px" />
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" prop="remark">
|
||||
<el-input v-model.trim="baseDataForm.remark" placeholder="请输入备注" style="width: 200px" />
|
||||
</el-form-item>
|
||||
</div>
|
||||
</el-form>
|
||||
|
||||
<el-row class="my-3">
|
||||
<el-button @click="addEvent">新增（顶部）</el-button>
|
||||
<el-button @click="pushEvent">新增（尾部）</el-button>
|
||||
<el-button @click="insertEvent">
|
||||
在第
|
||||
<el-input-number
|
||||
@click.stop
|
||||
v-model="state.insertedRowNumber"
|
||||
:min="0"
|
||||
:max="state.editableTableData.length"
|
||||
:precision="0"
|
||||
size="small"
|
||||
controls-position="right"
|
||||
style="min-width: 50px; margin: 0 5px"
|
||||
/>
|
||||
行新增
|
||||
</el-button>
|
||||
<el-button @click="removeSelectRowEvent" :disabled="state.selectedRowsErpSpuIds.length <= 0">删除选中</el-button>
|
||||
<el-button @click="clearData">清空数据</el-button>
|
||||
<el-button @click="handleClickSpuSelect">商品选择</el-button>
|
||||
</el-row>
|
||||
|
||||
<vxe-table
|
||||
ref="editableTableRef"
|
||||
border
|
||||
:loading="loading"
|
||||
show-overflow
|
||||
max-height="400"
|
||||
:edit-config="{
|
||||
trigger: 'click',
|
||||
mode: 'cell',
|
||||
beforeEditMethod({ row, column }:any) {
|
||||
// 禁止编辑
|
||||
if (column.property === '') {
|
||||
return false
|
||||
}
|
||||
return true
|
||||
},
|
||||
}"
|
||||
:column-config="{ resizable: true }"
|
||||
:row-config="{ isHover: true }"
|
||||
:resizable-config="{ dragMode: 'fixed' }"
|
||||
:data="state.editableTableData"
|
||||
:edit-rules="validRules"
|
||||
@checkbox-all="selectChangeEvent"
|
||||
@checkbox-change="selectChangeEvent"
|
||||
size="mini"
|
||||
align="center"
|
||||
>
|
||||
<vxe-column type="checkbox" width="40" fixed="left" />
|
||||
<vxe-column type="seq" width="50" fixed="left" />
|
||||
<vxe-column field="productName" title="库存商品">
|
||||
<template #default="{ row }">
|
||||
<span v-if="row.productName">{{ row.productName }}</span>
|
||||
<span v-else>{{ row.erpSpuId && state.erpSpuSimpleAll.find((item: any) => item.id === row.erpSpuId)?.productName }}</span>
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="unitId" title="包装单位" :edit-render="{}">
|
||||
<template #edit="{ row }">
|
||||
<el-select v-model="row.unitId" placeholder="请选择包装单位">
|
||||
<el-option
|
||||
v-if="row.erpUnitVos?.length > 0"
|
||||
v-for="item in row.erpUnitVos"
|
||||
:key="item.id"
|
||||
:label="item.unit"
|
||||
:value="item.id"
|
||||
/>
|
||||
<el-option v-else :key="row.id" :label="row.unit" :value="row.id" />
|
||||
</el-select>
|
||||
</template>
|
||||
<template #default="{ row }">
|
||||
<span v-if="row.unitId">{{ row.unit ?? row.erpUnitVos?.find((item: any) => item.id == row.unitId)?.unit }}</span>
|
||||
<span v-else style="color: #c0c4cf">请选择</span>
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="quantity" title="数量" :edit-render="{ autoFocus: 'input', placeholder: '请输入' }">
|
||||
<template #edit="{ row }">
|
||||
<el-input v-model="row.quantity" />
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="unitPrice" title="进价">
|
||||
<template #default="{ row }">
|
||||
{{
|
||||
row.purchasePrice
|
||||
? displayPrice(row.purchasePrice)
|
||||
: displayPrice(row.erpUnitVos?.find((item: any) => item.id == row.unitId)?.purchasePrice)
|
||||
}}
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="totalAmount" title="累计总金额">
|
||||
<template #default="{ row }">
|
||||
<span v-if="row.unitId && row.quantity && row.unit && !row.erpUnitVos">
|
||||
{{ displayPrice(row.quantity * parseFloat(row.purchasePrice)) }}
|
||||
</span>
|
||||
<span v-if="row.unitId && row.quantity && row.erpUnitVos">
|
||||
{{ displayPrice(Number(row.erpUnitVos?.find((item: any) => item.id == row.unitId)?.purchasePrice) * row.quantity) }}
|
||||
</span>
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="remark" title="备注" :edit-render="{ autoFocus: 'input', placeholder: '请输入' }">
|
||||
<template #edit="{ row }">
|
||||
<el-input v-model="row.remark" />
|
||||
</template>
|
||||
</vxe-column>
|
||||
</vxe-table>
|
||||
|
||||
<el-row class="my-3">
|
||||
<el-tooltip effect="dark" content="返回列表页面" placement="top">
|
||||
<el-button type="primary" plain @click="router.back()">取消</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip v-if="!baseDataForm.id" effect="dark" content="保存并清空数据" placement="top">
|
||||
<el-button type="primary" plain @click="onContinueAdd">继续添加</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip effect="dark" content="保存并返回列表页面" placement="top">
|
||||
<el-button type="primary" plain @click="onSave">保存</el-button>
|
||||
</el-tooltip>
|
||||
</el-row>
|
||||
|
||||
<!-- 商品选择对话框 -->
|
||||
<erpSpuSelectDialog
|
||||
ref="erpSpuSelectDialogRef"
|
||||
v-model="state.erpSpuSelectDialogVisible"
|
||||
:selectedSpuRows="state.editableTableData"
|
||||
@getSelectedSpuRows="getSelectedSpuRows"
|
||||
/>
|
||||
|
||||
<linkCodeDialog
|
||||
ref="linkCgPlanDialogRef"
|
||||
v-model="state.linkCgPlanDialogVisible"
|
||||
title="关联采购订单"
|
||||
:getTableData="getCgddPage"
|
||||
@getSelectedLinkCode="getSelectedLinkCode"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="smErpCgInventory">
|
||||
import { ref, reactive, computed, onMounted } from "vue"
|
||||
import { useRouter, useRoute } from "vue-router"
|
||||
import { useMessage } from "/@/hooks/message"
|
||||
import { getObj, addObj, putObj } from "/@/api/supermarketerp/smErpCgInventory"
|
||||
import { getPlanCode, getErpSpuSimpleAll } from "/@/api/supermarketerp/common"
|
||||
import { VxeTableEvents, VxeTablePropTypes, type VxeTableInstance } from "vxe-table"
|
||||
import { formatDate } from "/@/utils/formatTime"
|
||||
import { Search } from "@element-plus/icons-vue"
|
||||
import erpSpuSelectDialog from "/@/views/supermarketerp/components/erpSpuSelectDialog.vue"
|
||||
import linkCodeDialog from "../components/linkCodeDialog.vue"
|
||||
import { getCgddPage } from "/@/api/supermarketerp/smErpCgInventory"
|
||||
import { displayPrice } from "/@/utils/formatMoney"
|
||||
import { useDict } from "/@/hooks/dict"
|
||||
|
||||
const router = useRouter()
|
||||
const route = useRoute()
|
||||
const loading = ref(false) // 采购计划加载
|
||||
const erpSpuSelectDialogRef = ref() // 商品选择对话框ref
|
||||
const linkCgPlanDialogRef = ref() // 关联采购申请单对话框ref
|
||||
const baseDataFormRef = ref() // 基本数据表单ref
|
||||
const editableTableRef = ref<VxeTableInstance<any>>() // 可编辑表格ref
|
||||
const { check_status } = useDict("check_status")
|
||||
// 基本信息表单数据
|
||||
const baseDataForm = reactive<any>({
|
||||
id: "",
|
||||
inventoryCode: "",
|
||||
inventoryDate: formatDate(new Date(), "YYYY-mm-dd"),
|
||||
handlerUserId: "",
|
||||
checkStatus: "",
|
||||
checkUserId: "",
|
||||
checkTime: "",
|
||||
supplierId: "",
|
||||
remark: "",
|
||||
inventoryType: "3",
|
||||
orderType: "1",
|
||||
totalAmount: "",
|
||||
})
|
||||
const state = reactive<{
|
||||
editableTableData: any[]
|
||||
erpSpuItemsMemo: any[]
|
||||
selectedRowsErpSpuIds: string[]
|
||||
insertedRowNumber: number
|
||||
erpSpuSimpleAll: any
|
||||
linkCodeVisible: boolean
|
||||
erpSpuSelectDialogVisible: boolean
|
||||
linkCgPlanDialogVisible: boolean
|
||||
}>({
|
||||
editableTableData: [], // 可编辑表格数据
|
||||
erpSpuItemsMemo: [], // 请求到的可编辑表格商品数据的缓存
|
||||
selectedRowsErpSpuIds: [], // 可编辑表格已选行的ErpSpuId
|
||||
insertedRowNumber: 0, // 可编辑表格插入行的行号
|
||||
erpSpuSimpleAll: [], // 简要商品列表
|
||||
|
||||
linkCodeVisible: false, // 关联采购申请单对话框开关
|
||||
erpSpuSelectDialogVisible: false, // 商品选择对话框开关
|
||||
linkCgPlanDialogVisible: false, // 关联采购申请单对话框开关
|
||||
})
|
||||
|
||||
// 基本信息表单校验规则
|
||||
const dataRules = ref({
|
||||
inventoryCode: [{ required: true, message: "出入库记录表编号不能为空", trigger: "blur" }],
|
||||
inventoryDate: [{ required: true, message: "出入库记录表单据日期不能为空", trigger: "blur" }],
|
||||
handlerUserId: [{ required: true, message: "经办人不能为空", trigger: "blur" }],
|
||||
supplierId: [{ required: true, message: "货商不能为空", trigger: "blur" }],
|
||||
})
|
||||
|
||||
// 可编辑表格校验规则
|
||||
const validRules = ref<VxeTablePropTypes.EditRules<any>>({
|
||||
unitId: [{ required: true, message: "必须选择" }],
|
||||
quantity: [{ required: true, type: "number", min: 1, max: 99, message: "数值范围1~99" }],
|
||||
})
|
||||
|
||||
// 初始化数据
|
||||
const getInitData = async () => {
|
||||
baseDataForm.id = undefined
|
||||
const id = route.query.id as string
|
||||
if (id) {
|
||||
loading.value = true
|
||||
// 获取采购计划数据 & 获取简要商品列表
|
||||
const [cgPlanData] = await Promise.allSettled([getObj(id)])
|
||||
.then((results) => results.map((result) => (result.status === "fulfilled" ? result.value : null)))
|
||||
.finally(() => (loading.value = false))
|
||||
|
||||
if (cgPlanData && cgPlanData.code === 0) {
|
||||
Object.assign(baseDataForm, cgPlanData.data)
|
||||
state.editableTableData = cgPlanData.data.items
|
||||
state.erpSpuItemsMemo = cgPlanData.data.items
|
||||
}
|
||||
}
|
||||
|
||||
// 获取采购入库编号
|
||||
const [erpSpuSimpleAll, planCode] = await Promise.allSettled([getErpSpuSimpleAll(), getPlanCode({ type: 3 })]).then((results) =>
|
||||
results.map((result) => (result.status === "fulfilled" ? result.value : null)),
|
||||
)
|
||||
erpSpuSimpleAll && erpSpuSimpleAll.code === 0 && (state.erpSpuSimpleAll = erpSpuSimpleAll.data)
|
||||
planCode && planCode.code === 0 && (baseDataForm.inventoryCode = planCode.data)
|
||||
}
|
||||
|
||||
// 点击关联采购申请编号
|
||||
const handleClickLinkCode = () => linkCgPlanDialogRef.value.openLinkCodeDialog()
|
||||
|
||||
// 获取选择的采购申请
|
||||
const getSelectedLinkCode = (selectionRows: any) => {
|
||||
console.log("被选择的关联数据", selectionRows)
|
||||
|
||||
baseDataForm.linkCode = selectionRows.code
|
||||
state.editableTableData = selectionRows.items
|
||||
state.erpSpuItemsMemo = selectionRows.items
|
||||
state.linkCgPlanDialogVisible = false
|
||||
}
|
||||
|
||||
// 顶部表格行新增
|
||||
const addEvent = () => {
|
||||
const newRow: any = {
|
||||
id: "",
|
||||
erpSpuId: "",
|
||||
quantity: null,
|
||||
unitPrice: null,
|
||||
totalAmount: null,
|
||||
remark: "",
|
||||
unitId: "",
|
||||
}
|
||||
state.editableTableData.unshift(newRow)
|
||||
nextTick(() => {
|
||||
const $table = editableTableRef.value
|
||||
if ($table) {
|
||||
$table.setEditRow(newRow)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
// 底部表格行新增
|
||||
const pushEvent = () => {
|
||||
const newRow: any = {
|
||||
id: "",
|
||||
erpSpuId: "",
|
||||
quantity: null,
|
||||
unitPrice: null,
|
||||
totalAmount: null,
|
||||
remark: "",
|
||||
unitId: "",
|
||||
}
|
||||
state.editableTableData.push(newRow)
|
||||
nextTick(() => {
|
||||
const $table = editableTableRef.value
|
||||
if ($table) {
|
||||
$table.setEditRow(newRow)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
// 在指定行插入
|
||||
const insertEvent = () => {
|
||||
const newRow: any = {
|
||||
id: "",
|
||||
erpSpuId: "",
|
||||
quantity: null,
|
||||
unitPrice: null,
|
||||
totalAmount: null,
|
||||
remark: "",
|
||||
unitId: "",
|
||||
}
|
||||
state.editableTableData.splice(state.insertedRowNumber, 0, newRow)
|
||||
nextTick(() => {
|
||||
const $table = editableTableRef.value
|
||||
if ($table) {
|
||||
$table.setEditRow(newRow)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
// 删除选中的行
|
||||
const removeSelectRowEvent = () => {
|
||||
const $table = editableTableRef.value
|
||||
if ($table) {
|
||||
const selectRecords = $table.getCheckboxRecords()
|
||||
if (selectRecords.length > 0) {
|
||||
state.editableTableData = state.editableTableData.filter((item) => !selectRecords.some((row) => row.erpSpuId === item.erpSpuId))
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 可编辑表格行勾选
|
||||
const selectChangeEvent: VxeTableEvents.CheckboxChange<any> = ({ checked }) => {
|
||||
const $table = editableTableRef.value
|
||||
if ($table) {
|
||||
const records = $table.getCheckboxRecords()
|
||||
console.log(checked ? "勾选事件" : "取消事件", records)
|
||||
state.selectedRowsErpSpuIds = records.map((item) => item.erpSpuId)
|
||||
}
|
||||
}
|
||||
|
||||
// 点击商品选择
|
||||
const handleClickSpuSelect = () => erpSpuSelectDialogRef.value.openDialog()
|
||||
|
||||
// 获取被选择的商品行
|
||||
const getSelectedSpuRows = (selectionRows: any) => {
|
||||
console.log("被选择的商品行", selectionRows)
|
||||
|
||||
// 筛选新勾选的项
|
||||
const addedItems = selectionRows
|
||||
.filter((item: any) => !state.editableTableData.some((editableTableItem: any) => editableTableItem.erpSpuId === item.erpSpuId))
|
||||
.map((addItem: any) => {
|
||||
const index = state.erpSpuItemsMemo.findIndex((item: any) => item.erpSpuId === addItem.erpSpuId)
|
||||
if (index !== -1) return state.erpSpuItemsMemo[index]
|
||||
return { ...addItem, isNew: true }
|
||||
}) // 为新增的数据项添加isNew，若该项原本已经存在，则不添加isNew
|
||||
// 仅添加新勾选的项
|
||||
state.editableTableData = [...state.editableTableData, ...addedItems]
|
||||
|
||||
// 筛选取消勾选的项
|
||||
const removedItems = state.editableTableData.filter(
|
||||
(item: any) => !selectionRows.some((selectedItem: any) => selectedItem.erpSpuId === item.erpSpuId),
|
||||
)
|
||||
// 仅移除取消勾选的项
|
||||
state.editableTableData = state.editableTableData.filter(
|
||||
(item: any) => !removedItems.some((removeItem: any) => removeItem.erpSpuId === item.erpSpuId),
|
||||
)
|
||||
// state.editableTableData.push(item)
|
||||
// nextTick(() => {
|
||||
// const $table = editableTableRef.value
|
||||
// if ($table) {
|
||||
// $table.setRow(item)
|
||||
// }
|
||||
// })
|
||||
state.erpSpuSelectDialogVisible = false
|
||||
console.log("state.editableTableData", state.editableTableData)
|
||||
}
|
||||
|
||||
// 整理数据
|
||||
const cgPlanSpuItems = computed(() => {
|
||||
return state.editableTableData.map((item: any) => {
|
||||
if (item.erpUnitVos) {
|
||||
const unit = item.erpUnitVos.find((unitItem: any) => unitItem.id === item.unitId)
|
||||
return {
|
||||
id: item.isNew ? undefined : item.id,
|
||||
erpSpuId: item.erpSpuId,
|
||||
quantity: item.quantity,
|
||||
unitPrice: unit.purchasePrice ? Number(unit?.purchasePrice) : 0,
|
||||
totalAmount: Number(unit?.purchasePrice || 0) * item.quantity,
|
||||
remark: item.remark,
|
||||
unitId: item.unitId,
|
||||
}
|
||||
} else {
|
||||
return {
|
||||
id: item.isNew ? undefined : item.id,
|
||||
erpSpuId: item.erpSpuId,
|
||||
quantity: item.quantity,
|
||||
unitPrice: item.purchasePrice ? Number(item.purchasePrice) : 0,
|
||||
totalAmount: item?.purchasePrice && item.quantity ? Number(item.purchasePrice) * item.quantity : 0,
|
||||
remark: item.remark,
|
||||
unitId: item.unitId,
|
||||
}
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
// 点击继续添加
|
||||
const onContinueAdd = async () => {
|
||||
console.log("baseDataForm", baseDataForm)
|
||||
console.log("state.editableTableData", state.editableTableData)
|
||||
;(await baseDataFormValidate()) && checkSelectSpu() && (await editableTableValidate()) && (await submitData()) && clearData()
|
||||
}
|
||||
|
||||
// 点击保存
|
||||
const onSave = async () => {
|
||||
console.log("baseDataForm", baseDataForm)
|
||||
console.log("state.editableTableData", state.editableTableData)
|
||||
;(await baseDataFormValidate()) &&
|
||||
checkSelectSpu() &&
|
||||
(await editableTableValidate()) &&
|
||||
(await submitData()) &&
|
||||
clearData() &&
|
||||
router.replace({ path: "/supermarketerp/smErpCgInventory/index" })
|
||||
}
|
||||
|
||||
// 校验基本数据表单 成功返回 true 失败返回 undefined
|
||||
const baseDataFormValidate = async () => {
|
||||
const valid = await baseDataFormRef.value.validate().catch(() => {})
|
||||
return valid
|
||||
}
|
||||
|
||||
// 校验是否选择了商品 成功返回 true 失败返回 false
|
||||
const checkSelectSpu = () => {
|
||||
if (state.editableTableData.length <= 0) {
|
||||
useMessage().warning("请选择商品")
|
||||
return false
|
||||
} else {
|
||||
return true
|
||||
}
|
||||
}
|
||||
|
||||
// 校验可编辑表格 成功返回 true 失败返回 false
|
||||
const editableTableValidate = async () => {
|
||||
// 全量校验
|
||||
const $table = editableTableRef.value
|
||||
if ($table) {
|
||||
const errMap = await $table.validate(true)
|
||||
if (errMap) {
|
||||
console.log("全量校验失败！")
|
||||
return false
|
||||
} else {
|
||||
console.log("全量校验成功！")
|
||||
return true
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 提交数据 成功返回 true 失败返回 false
|
||||
const submitData = async () => {
|
||||
try {
|
||||
loading.value = true
|
||||
|
||||
const _pa = {
|
||||
...baseDataForm,
|
||||
items: cgPlanSpuItems.value,
|
||||
}
|
||||
|
||||
console.log("提交的数据：", _pa)
|
||||
|
||||
const res = baseDataForm.id
|
||||
? await putObj(_pa).finally(() => (loading.value = false))
|
||||
: await addObj(_pa).finally(() => (loading.value = false))
|
||||
if (res.code === 0) {
|
||||
useMessage().success(baseDataForm.id ? "修改成功" : "添加成功")
|
||||
return true
|
||||
} else {
|
||||
useMessage().error(res.msg)
|
||||
return false
|
||||
}
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg)
|
||||
loading.value = false
|
||||
return false
|
||||
}
|
||||
}
|
||||
|
||||
// 清空填写的数据 返回 true
|
||||
const clearData = () => {
|
||||
for (const key in baseDataForm) {
|
||||
if (key === "id" || key === "inventoryCode" || key === "inventoryDate") continue
|
||||
baseDataForm[key] = ""
|
||||
}
|
||||
state.insertedRowNumber = 0
|
||||
state.editableTableData = []
|
||||
state.erpSpuItemsMemo = []
|
||||
state.selectedRowsErpSpuIds = []
|
||||
return true
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
getInitData()
|
||||
})
|
||||
</script>
|
||||
@@ -0,0 +1,468 @@
|
||||
<template>
|
||||
<div class="layout-padding">
|
||||
<div v-loading="loading" class="layout-padding-auto layout-padding-view" style="overflow: scroll">
|
||||
<el-form ref="baseDataFormRef" :model="baseDataForm" :rules="dataRules" label-width="100px">
|
||||
<div class="flex flex-wrap">
|
||||
<el-form-item label="编号" prop="planCode">
|
||||
<el-input v-model="baseDataForm.planCode" readonly style="width: 200px" />
|
||||
</el-form-item>
|
||||
<el-form-item label="单据日期" prop="planDate">
|
||||
<el-input v-model="baseDataForm.planDate" readonly style="width: 200px" />
|
||||
</el-form-item>
|
||||
<el-form-item label="经办人" prop="handlerUserId">
|
||||
<SelectHandlerUser v-model.trim="baseDataForm.handlerUserId" placeholder="请选择经办人" style="width: 200px" />
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" prop="remark">
|
||||
<el-input v-model.trim="baseDataForm.remark" placeholder="请输入备注" maxlength="200" style="width: 200px" />
|
||||
</el-form-item>
|
||||
</div>
|
||||
</el-form>
|
||||
|
||||
<el-row class="my-3">
|
||||
<el-button @click="addEvent">新增（顶部）</el-button>
|
||||
<el-button @click="pushEvent">新增（尾部）</el-button>
|
||||
<el-button @click="insertEvent">
|
||||
在第
|
||||
<el-input-number
|
||||
@click.stop
|
||||
v-model="state.insertedRowNumber"
|
||||
:min="0"
|
||||
:max="state.editableTableData.length"
|
||||
:precision="0"
|
||||
size="small"
|
||||
controls-position="right"
|
||||
style="min-width: 50px; margin: 0 5px"
|
||||
/>
|
||||
行新增
|
||||
</el-button>
|
||||
<el-button @click="removeSelectRowEvent" :disabled="state.selectedRowsErpSpuIds.length <= 0">删除选中</el-button>
|
||||
<el-button @click="clearData">清空数据</el-button>
|
||||
<el-button @click="handleClickSpuSelect">商品选择</el-button>
|
||||
</el-row>
|
||||
|
||||
<vxe-table
|
||||
ref="editableTableRef"
|
||||
border
|
||||
:loading="loading"
|
||||
show-overflow
|
||||
max-height="400"
|
||||
:edit-config="{
|
||||
trigger: 'click',
|
||||
mode: 'cell',
|
||||
beforeEditMethod({ row, column }:any) {
|
||||
// 禁止编辑
|
||||
if (column.property === '') {
|
||||
return false
|
||||
}
|
||||
return true
|
||||
},
|
||||
}"
|
||||
:column-config="{ resizable: true }"
|
||||
:row-config="{ isHover: true }"
|
||||
:resizable-config="{ dragMode: 'fixed' }"
|
||||
:data="state.editableTableData"
|
||||
:edit-rules="validRules"
|
||||
@checkbox-all="selectChangeEvent"
|
||||
@checkbox-change="selectChangeEvent"
|
||||
size="mini"
|
||||
align="center"
|
||||
>
|
||||
<vxe-column type="checkbox" width="40" fixed="left" />
|
||||
<vxe-column type="seq" width="50" fixed="left" />
|
||||
<!-- <vxe-column field="planId" title="采购" :edit-render="{ autoFocus: 'input', placeholder: '请输入' }">
|
||||
<template #edit="{ row }">
|
||||
<el-input v-model="row.planId" />
|
||||
</template>
|
||||
</vxe-column> -->
|
||||
<vxe-column field="productName" title="库存商品">
|
||||
<template #default="{ row }">
|
||||
<span v-if="row.productName">{{ row.productName }}</span>
|
||||
<span v-else>{{ row.erpSpuId && state.erpSpuSimpleAll.find((item: any) => item.id === row.erpSpuId).productName }}</span>
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="unitId" title="包装单位" :edit-render="{}">
|
||||
<template #edit="{ row }">
|
||||
<el-select v-model="row.unitId" placeholder="请选择包装单位">
|
||||
<el-option
|
||||
v-if="row.erpUnitVos?.length > 0"
|
||||
v-for="item in row.erpUnitVos"
|
||||
:key="item.id"
|
||||
:label="item.unit"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</template>
|
||||
<template #default="{ row }">
|
||||
<span v-if="row.unitId">{{ row.erpUnitVos?.find((item: any) => item.id == row.unitId)?.unit }}</span>
|
||||
<span v-else style="color: #c0c4cf">请选择</span>
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="quantity" title="数量" :edit-render="{ autoFocus: 'input', placeholder: '请输入' }">
|
||||
<template #edit="{ row }">
|
||||
<el-input v-model="row.quantity" />
|
||||
</template>
|
||||
</vxe-column>
|
||||
<!-- <vxe-column field="unitPrice" title="进价">
|
||||
<template #default="{ row }">
|
||||
{{ row.erpUnitVos?.find((item: any) => item.id == row.unitId)?.purchasePrice }}
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="totalAmount" title="累计总金额">
|
||||
<template #default="{ row }">
|
||||
{{
|
||||
row.unitId && row.quantity
|
||||
? Number(row.erpUnitVos?.find((item: any) => item.id == row.unitId)?.purchasePrice) * row.quantity
|
||||
: ""
|
||||
}}
|
||||
</template>
|
||||
</vxe-column> -->
|
||||
<vxe-column field="remark" title="备注" :edit-render="{ autoFocus: 'input', placeholder: '请输入' }">
|
||||
<template #edit="{ row }">
|
||||
<el-input v-model="row.remark" />
|
||||
</template>
|
||||
</vxe-column>
|
||||
<!-- <vxe-column field="merchantId" title="商户编号" :edit-render="{ autoFocus: 'input', placeholder: '请选择' }">-->
|
||||
<!-- <template #edit="{ row }">-->
|
||||
<!-- <select-mch v-model="row.merchantId" />-->
|
||||
<!-- </template>-->
|
||||
<!-- </vxe-column>-->
|
||||
<!-- <vxe-column field="deptId" title="部门id" :edit-render="{ autoFocus: 'input', placeholder: '请输入' }">-->
|
||||
<!-- <template #edit="{ row }">-->
|
||||
<!-- <el-input v-model="row.deptId" />-->
|
||||
<!-- </template>-->
|
||||
<!-- </vxe-column>-->
|
||||
</vxe-table>
|
||||
|
||||
<el-row class="my-3">
|
||||
<el-tooltip effect="dark" content="返回列表页面" placement="top">
|
||||
<el-button type="primary" plain @click="router.back()">取消</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip v-if="!baseDataForm.id" effect="dark" content="保存并清空数据" placement="top">
|
||||
<el-button type="primary" plain @click="onContinueAdd">继续添加</el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip effect="dark" content="保存并返回列表页面" placement="top">
|
||||
<el-button type="primary" plain @click="onSave">保存</el-button>
|
||||
</el-tooltip>
|
||||
</el-row>
|
||||
|
||||
<!-- 商品选择对话框 -->
|
||||
<erpSpuSelectDialog
|
||||
ref="erpSpuSelectDialogRef"
|
||||
v-model="state.erpSpuSelectDialogVisible"
|
||||
:selectedSpuRows="state.editableTableData"
|
||||
@getSelectedSpuRows="getSelectedSpuRows"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="cgPlanOption">
|
||||
import { ref, reactive, computed, onMounted } from "vue"
|
||||
import { useRouter, useRoute } from "vue-router"
|
||||
import { useMessage } from "/@/hooks/message"
|
||||
import { VxeTableEvents, VxeTablePropTypes, type VxeTableInstance } from "vxe-table"
|
||||
import { getObj, addObj, putObj } from "/@/api/supermarketerp/smErpCgPlan"
|
||||
import { getPlanCode, getErpSpuSimpleAll } from "/@/api/supermarketerp/common"
|
||||
import erpSpuSelectDialog from "/@/views/supermarketerp/components/erpSpuSelectDialog.vue"
|
||||
import { formatDate } from "/@/utils/formatTime"
|
||||
|
||||
const router = useRouter()
|
||||
const route = useRoute()
|
||||
const erpSpuSelectDialogRef = ref() // 商品选择对话框ref
|
||||
const loading = ref(false) // 采购计划加载
|
||||
const baseDataFormRef = ref() // 基本数据表单ref
|
||||
const editableTableRef = ref<VxeTableInstance<any>>() // 可编辑表格ref
|
||||
// 基本信息表单数据
|
||||
const baseDataForm = reactive<any>({
|
||||
id: undefined,
|
||||
planCode: "",
|
||||
planDate: formatDate(new Date(), "YYYY-mm-dd"),
|
||||
handlerUserId: "",
|
||||
remark: "",
|
||||
})
|
||||
const state = reactive<{
|
||||
editableTableData: any[]
|
||||
erpSpuItemsMemo: any[]
|
||||
selectedRowsErpSpuIds: string[]
|
||||
insertedRowNumber: number
|
||||
erpSpuSimpleAll: any
|
||||
erpSpuSelectDialogVisible: boolean
|
||||
}>({
|
||||
editableTableData: [], // 可编辑表格数据
|
||||
erpSpuItemsMemo: [], // 请求到的可编辑表格商品数据的缓存
|
||||
selectedRowsErpSpuIds: [], // 可编辑表格已选行的ErpSpuId
|
||||
insertedRowNumber: 0, // 可编辑表格插入行的行号
|
||||
erpSpuSimpleAll: [], // 简要商品列表
|
||||
erpSpuSelectDialogVisible: false, // 商品选择对话框开关
|
||||
})
|
||||
|
||||
// 基本信息表单校验规则
|
||||
const dataRules = ref({
|
||||
planCode: [{ required: true, message: "采购计划编号不能为空", trigger: "blur" }],
|
||||
planDate: [{ required: true, message: "采购计划单据日期不能为空", trigger: "blur" }],
|
||||
handlerUserId: [{ required: true, message: "经办人不能为空", trigger: "blur" }],
|
||||
})
|
||||
|
||||
// 可编辑表格校验规则
|
||||
const validRules = ref<VxeTablePropTypes.EditRules<any>>({
|
||||
unitId: [{ required: true, message: "必须选择" }],
|
||||
quantity: [{ required: true, type: "number", min: 1, max: 99, message: "数值范围1~99" }],
|
||||
})
|
||||
|
||||
// 初始化数据
|
||||
const getInitData = async () => {
|
||||
baseDataForm.id = undefined
|
||||
const id = route.query.id as string
|
||||
if (id) {
|
||||
loading.value = true
|
||||
// 获取补货申请编号 & 获取简要商品列表
|
||||
const [cgPlanData, erpSpuSimpleAll] = await Promise.allSettled([getObj(id), getErpSpuSimpleAll()])
|
||||
.then((results) => results.map((result) => (result.status === "fulfilled" ? result.value : null)))
|
||||
.finally(() => (loading.value = false))
|
||||
|
||||
if (cgPlanData && cgPlanData.code === 0) {
|
||||
Object.assign(baseDataForm, cgPlanData.data)
|
||||
state.editableTableData = cgPlanData.data.items
|
||||
state.erpSpuItemsMemo = cgPlanData.data.items
|
||||
}
|
||||
erpSpuSimpleAll && erpSpuSimpleAll.code === 0 && (state.erpSpuSimpleAll = erpSpuSimpleAll.data)
|
||||
}
|
||||
|
||||
// 获取采购计划编号
|
||||
const [planCode] = await Promise.allSettled([getPlanCode({ type: 1 })]).then((results) =>
|
||||
results.map((result) => (result.status === "fulfilled" ? result.value : null)),
|
||||
)
|
||||
planCode && planCode.code === 0 && (baseDataForm.planCode = planCode.data)
|
||||
}
|
||||
|
||||
// 顶部表格行新增
|
||||
const addEvent = () => {
|
||||
const newRow: any = {
|
||||
id: "",
|
||||
erpSpuId: "",
|
||||
quantity: null,
|
||||
unitPrice: null,
|
||||
totalAmount: null,
|
||||
remark: "",
|
||||
unitId: "",
|
||||
}
|
||||
state.editableTableData.unshift(newRow)
|
||||
nextTick(() => {
|
||||
const $table = editableTableRef.value
|
||||
if ($table) {
|
||||
$table.setEditRow(newRow)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
// 底部表格行新增
|
||||
const pushEvent = () => {
|
||||
const newRow: any = {
|
||||
id: "",
|
||||
erpSpuId: "",
|
||||
quantity: null,
|
||||
unitPrice: null,
|
||||
totalAmount: null,
|
||||
remark: "",
|
||||
unitId: "",
|
||||
}
|
||||
state.editableTableData.push(newRow)
|
||||
nextTick(() => {
|
||||
const $table = editableTableRef.value
|
||||
if ($table) {
|
||||
$table.setEditRow(newRow)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
// 在指定行插入
|
||||
const insertEvent = () => {
|
||||
const newRow: any = {
|
||||
id: "",
|
||||
erpSpuId: "",
|
||||
quantity: null,
|
||||
unitPrice: null,
|
||||
totalAmount: null,
|
||||
remark: "",
|
||||
unitId: "",
|
||||
}
|
||||
state.editableTableData.splice(state.insertedRowNumber, 0, newRow)
|
||||
nextTick(() => {
|
||||
const $table = editableTableRef.value
|
||||
if ($table) {
|
||||
$table.setEditRow(newRow)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
// 删除选中的行
|
||||
const removeSelectRowEvent = () => {
|
||||
const $table = editableTableRef.value
|
||||
if ($table) {
|
||||
const selectRecords = $table.getCheckboxRecords()
|
||||
if (selectRecords.length > 0) {
|
||||
state.editableTableData = state.editableTableData.filter((item) => !selectRecords.some((row) => row.erpSpuId === item.erpSpuId))
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 可编辑表格行勾选
|
||||
const selectChangeEvent: VxeTableEvents.CheckboxChange<any> = ({ checked }) => {
|
||||
const $table = editableTableRef.value
|
||||
if ($table) {
|
||||
const records = $table.getCheckboxRecords()
|
||||
console.log(checked ? "勾选事件" : "取消事件", records)
|
||||
state.selectedRowsErpSpuIds = records.map((item) => item.erpSpuId)
|
||||
}
|
||||
}
|
||||
|
||||
// 点击商品选择
|
||||
const handleClickSpuSelect = () => erpSpuSelectDialogRef.value.openDialog()
|
||||
|
||||
// 获取被选择的商品行
|
||||
const getSelectedSpuRows = (selectionRows: any) => {
|
||||
console.log("被选择的商品行", selectionRows)
|
||||
|
||||
// 筛选新勾选的项
|
||||
const addedItems = selectionRows
|
||||
.filter((item: any) => !state.editableTableData.some((editableTableItem: any) => editableTableItem.erpSpuId === item.erpSpuId))
|
||||
.map((addItem: any) => {
|
||||
const index = state.erpSpuItemsMemo.findIndex((item: any) => item.erpSpuId === addItem.erpSpuId)
|
||||
if (index !== -1) return state.erpSpuItemsMemo[index]
|
||||
return { ...addItem, isNew: true }
|
||||
}) // 为新增的数据项添加isNew，若该项原本已经存在，则不添加isNew
|
||||
// 仅添加新勾选的项
|
||||
state.editableTableData = [...state.editableTableData, ...addedItems]
|
||||
|
||||
// 筛选取消勾选的项
|
||||
const removedItems = state.editableTableData.filter(
|
||||
(item: any) => !selectionRows.some((selectedItem: any) => selectedItem.erpSpuId === item.erpSpuId),
|
||||
)
|
||||
// 仅移除取消勾选的项
|
||||
state.editableTableData = state.editableTableData.filter(
|
||||
(item: any) => !removedItems.some((removeItem: any) => removeItem.erpSpuId === item.erpSpuId),
|
||||
)
|
||||
// state.editableTableData.push(item)
|
||||
// nextTick(() => {
|
||||
// const $table = editableTableRef.value
|
||||
// if ($table) {
|
||||
// $table.setRow(item)
|
||||
// }
|
||||
// })
|
||||
state.erpSpuSelectDialogVisible = false
|
||||
console.log("state.editableTableData", state.editableTableData)
|
||||
}
|
||||
|
||||
// 整理数据
|
||||
const cgPlanSpuItems = computed(() => {
|
||||
return state.editableTableData.map((item: any) => {
|
||||
const unit = item.erpUnitVos.find((unitItem: any) => unitItem.id === item.unitId)
|
||||
return {
|
||||
id: item.isNew ? undefined : item.id,
|
||||
erpSpuId: item.erpSpuId,
|
||||
quantity: item.quantity,
|
||||
unitPrice: unit.purchasePrice ? Number(unit?.purchasePrice) : 0,
|
||||
totalAmount: Number(unit?.purchasePrice || 0) * item.quantity,
|
||||
remark: item.remark,
|
||||
unitId: item.unitId,
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
// 点击继续添加
|
||||
const onContinueAdd = async () => {
|
||||
console.log("baseDataForm", baseDataForm)
|
||||
console.log("state.editableTableData", state.editableTableData)
|
||||
;(await baseDataFormValidate()) && checkSelectSpu() && (await editableTableValidate()) && (await submitData()) && clearData()
|
||||
}
|
||||
|
||||
// 点击保存
|
||||
const onSave = async () => {
|
||||
console.log("baseDataForm", baseDataForm)
|
||||
console.log("state.editableTableData", state.editableTableData)
|
||||
;(await baseDataFormValidate()) &&
|
||||
checkSelectSpu() &&
|
||||
(await editableTableValidate()) &&
|
||||
(await submitData()) &&
|
||||
clearData() &&
|
||||
router.replace({ path: "/supermarketerp/smErpCgPlan/index" })
|
||||
}
|
||||
|
||||
// 校验基本数据表单 成功返回 true 失败返回 undefined
|
||||
const baseDataFormValidate = async () => {
|
||||
const valid = await baseDataFormRef.value.validate().catch(() => {})
|
||||
return valid
|
||||
}
|
||||
|
||||
// 校验是否选择了商品 成功返回 true 失败返回 false
|
||||
const checkSelectSpu = () => {
|
||||
if (state.editableTableData.length <= 0) {
|
||||
useMessage().warning("请选择商品")
|
||||
return false
|
||||
} else {
|
||||
return true
|
||||
}
|
||||
}
|
||||
|
||||
// 校验可编辑表格 成功返回 true 失败返回 false
|
||||
const editableTableValidate = async () => {
|
||||
// 全量校验
|
||||
const $table = editableTableRef.value
|
||||
if ($table) {
|
||||
const errMap = await $table.validate(true)
|
||||
if (errMap) {
|
||||
console.log("全量校验失败！")
|
||||
return false
|
||||
} else {
|
||||
console.log("全量校验成功！")
|
||||
return true
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 提交数据 成功返回 true 失败返回 false
|
||||
const submitData = async () => {
|
||||
try {
|
||||
loading.value = true
|
||||
|
||||
const _pa = {
|
||||
...baseDataForm,
|
||||
items: cgPlanSpuItems.value,
|
||||
}
|
||||
|
||||
console.log("提交的数据：", _pa)
|
||||
|
||||
const res = baseDataForm.id
|
||||
? await putObj(_pa).finally(() => (loading.value = false))
|
||||
: await addObj(_pa).finally(() => (loading.value = false))
|
||||
if (res.code === 0) {
|
||||
useMessage().success(baseDataForm.id ? "修改成功" : "添加成功")
|
||||
return true
|
||||
} else {
|
||||
useMessage().error(res.msg)
|
||||
return false
|
||||
}
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg)
|
||||
loading.value = false
|
||||
return false
|
||||
}
|
||||
}
|
||||
|
||||
// 清空填写的数据 返回 true
|
||||
const clearData = () => {
|
||||
for (const key in baseDataForm) {
|
||||
if (key === "planCode" || key === "id" || key === "planDate") continue
|
||||
baseDataForm[key] = ""
|
||||
}
|
||||
state.insertedRowNumber = 0
|
||||
state.editableTableData = []
|
||||
state.erpSpuItemsMemo = []
|
||||
state.selectedRowsErpSpuIds = []
|
||||
return true
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
getInitData()
|
||||
})
|
||||
</script>
|
||||
@@ -0,0 +1,153 @@
|
||||
<template>
|
||||
<div class="layout-padding">
|
||||
<div class="layout-padding-auto layout-padding-view">
|
||||
<el-row v-show="showSearch">
|
||||
<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
|
||||
<el-form-item label="单据编号" prop="planCode">
|
||||
<el-input placeholder="请输入采购单据编号" v-model="state.queryForm.planCode" />
|
||||
</el-form-item>
|
||||
<el-form-item label="单据日期" prop="planDate">
|
||||
<el-date-picker type="date" placeholder="请输入单据日期" v-model="state.queryForm.planDate" />
|
||||
</el-form-item>
|
||||
<el-form-item label="经办人" prop="handlerUserId">
|
||||
<SelectHandlerUser v-model.trim="state.queryForm.handlerUserId" placeholder="请选择经办人" style="width: 200px" />
|
||||
</el-form-item>
|
||||
<el-form-item label="审批状态" prop="checkStatus">
|
||||
<el-select v-model="state.queryForm.checkStatus" placeholder="请选择审批状态">
|
||||
<el-option label="请选择" value="00" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button icon="search" type="primary" @click="getDataList">查询</el-button>
|
||||
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<div class="mb8" style="width: 100%">
|
||||
<el-button icon="folder-add" type="primary" class="ml10" @click="handleClickCreateCgPlan" v-auth="'supermarket_smErpCgPlan_add'">
|
||||
新 增
|
||||
</el-button>
|
||||
<el-button
|
||||
plain
|
||||
:disabled="multiple"
|
||||
icon="Delete"
|
||||
type="primary"
|
||||
v-auth="'supermarket_smErpCgPlan_del'"
|
||||
@click="handleDelete(selectObjs)"
|
||||
>
|
||||
删 除
|
||||
</el-button>
|
||||
<right-toolbar
|
||||
v-model:showSearch="showSearch"
|
||||
:export="'supermarket_smErpCgPlan_export'"
|
||||
@exportExcel="exportExcel"
|
||||
class="ml10 mr20"
|
||||
style="float: right"
|
||||
@queryTable="getDataList"
|
||||
/>
|
||||
</div>
|
||||
</el-row>
|
||||
|
||||
<el-table
|
||||
:data="state.dataList"
|
||||
v-loading="state.loading"
|
||||
border
|
||||
:cell-style="tableStyle.cellStyle"
|
||||
:header-cell-style="tableStyle.headerCellStyle"
|
||||
@selection-change="selectionChangHandle"
|
||||
@sort-change="sortChangeHandle"
|
||||
>
|
||||
<el-table-column type="selection" width="40" align="center" />
|
||||
<el-table-column type="index" label="#" width="50" />
|
||||
<el-table-column prop="planCode" label="编号" show-overflow-tooltip />
|
||||
<el-table-column prop="planDate" label="单据日期" show-overflow-tooltip />
|
||||
<el-table-column prop="productName" label="商品信息" show-overflow-tooltip />
|
||||
<el-table-column prop="handlerUserName" label="经办人" show-overflow-tooltip />
|
||||
<!-- <el-table-column prop="checkStatus" label="审批状态" show-overflow-tooltip />-->
|
||||
<el-table-column prop="remark" label="备注" show-overflow-tooltip />
|
||||
<el-table-column label="操作" width="150">
|
||||
<template #default="scope">
|
||||
<el-button
|
||||
icon="edit-pen"
|
||||
text
|
||||
type="primary"
|
||||
v-auth="'supermarket_smErpCgPlan_edit'"
|
||||
@click="handleClickEditCgPlan(scope.row.id)"
|
||||
>
|
||||
编辑
|
||||
</el-button>
|
||||
<el-button icon="delete" text type="primary" v-auth="'supermarket_smErpCgPlan_del'" @click="handleDelete([scope.row.id])">
|
||||
删除
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="systemSmErpCgPlan">
|
||||
import { useRouter } from "vue-router"
|
||||
import { BasicTableProps, useTable } from "/@/hooks/table"
|
||||
import { fetchList, delObjs } from "/@/api/supermarketerp/smErpCgPlan"
|
||||
import { useMessage, useMessageBox } from "/@/hooks/message"
|
||||
|
||||
const router = useRouter()
|
||||
// 搜索变量
|
||||
const queryRef = ref()
|
||||
const showSearch = ref(true)
|
||||
// 多选变量
|
||||
const selectObjs = ref([]) as any
|
||||
const multiple = ref(true)
|
||||
|
||||
const state: BasicTableProps = reactive<BasicTableProps>({
|
||||
queryForm: {},
|
||||
pageList: fetchList,
|
||||
})
|
||||
|
||||
const { getDataList, currentChangeHandle, sizeChangeHandle, sortChangeHandle, downBlobFile, tableStyle } = useTable(state)
|
||||
|
||||
// 清空搜索条件
|
||||
const resetQuery = () => {
|
||||
// 清空搜索条件
|
||||
queryRef.value?.resetFields()
|
||||
// 清空多选
|
||||
selectObjs.value = []
|
||||
getDataList()
|
||||
}
|
||||
|
||||
// 导出excel
|
||||
const exportExcel = () => {
|
||||
downBlobFile("/supermarket/smErpCgPlan/export", Object.assign(state.queryForm, { ids: selectObjs }), "smErpCgPlan.xlsx")
|
||||
}
|
||||
|
||||
// 多选事件
|
||||
const selectionChangHandle = (objs: { id: string }[]) => {
|
||||
selectObjs.value = objs.map(({ id }) => id)
|
||||
multiple.value = !objs.length
|
||||
}
|
||||
|
||||
// 点击创建采购清单
|
||||
const handleClickCreateCgPlan = () => router.push({ path: "/supermarketerp/smErpCgPlan/cgPlanOption" })
|
||||
// 点击编辑采购清单
|
||||
const handleClickEditCgPlan = (id: string) => router.push({ path: "/supermarketerp/smErpCgPlan/cgPlanOption", query: { id } })
|
||||
|
||||
// 删除操作
|
||||
const handleDelete = async (ids: string[]) => {
|
||||
try {
|
||||
await useMessageBox().confirm("此操作将永久删除")
|
||||
} catch {
|
||||
return
|
||||
}
|
||||
|
||||
try {
|
||||
await delObjs(ids)
|
||||
getDataList()
|
||||
useMessage().success("删除成功")
|
||||
} catch (err: any) {
|
||||
useMessage().error(err.msg)
|
||||
}
|
||||
}
|
||||
</script>
|
||||
Reference in new issue
Block a user