采购计划可编辑表格
This commit is contained in:
weiwei committed
1 parent
84828b8cb2
commit
a7a3f80376
7 files changed
+849
-403
No files matched your search
+2
-1
@@ -55,7 +55,8 @@
|
|||||||
"vue-router": "^4.1.6",
|
"vue-router": "^4.1.6",
|
||||||
"vue3-tree-org": "^4.2.2",
|
"vue3-tree-org": "^4.2.2",
|
||||||
"vue3-video-play": "1.3.1-beta.6",
|
"vue3-video-play": "1.3.1-beta.6",
|
||||||
"vuedraggable": "^4.1.0"
|
"vuedraggable": "^4.1.0",
|
||||||
|
"vxe-table": "^4.10.15"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@types/crypto-js": "^4.2.2",
|
"@types/crypto-js": "^4.2.2",
|
||||||
|
|||||||
+19
-16
@@ -1,31 +1,34 @@
|
|||||||
import { createApp } from 'vue';
|
import { createApp } from "vue"
|
||||||
import pinia from '/@/stores/index';
|
import pinia from "/@/stores/index"
|
||||||
import App from './App.vue';
|
import App from "./App.vue"
|
||||||
import router from './router';
|
import router from "./router"
|
||||||
import { directive } from '/@/directive';
|
import { directive } from "/@/directive"
|
||||||
import Components from '/@/components';
|
import Components from "/@/components"
|
||||||
import { i18n } from '/@/i18n';
|
import { i18n } from "/@/i18n"
|
||||||
import { properties } from '/@/utils/globalProperties';
|
import { properties } from "/@/utils/globalProperties"
|
||||||
import { initAntiDebug } from '/@/utils/anti-debug';
|
import { initAntiDebug } from "/@/utils/anti-debug"
|
||||||
import "/@/assets/styles/global.scss"
|
import "/@/assets/styles/global.scss"
|
||||||
|
import VxeUITable from "vxe-table"
|
||||||
|
import "vxe-table/lib/style.css"
|
||||||
|
|
||||||
// Initialize anti-debug protection
|
// Initialize anti-debug protection
|
||||||
initAntiDebug();
|
initAntiDebug()
|
||||||
|
|
||||||
// 导入全局样式
|
// 导入全局样式
|
||||||
import '/@/theme/tailwind.css';
|
import "/@/theme/tailwind.css"
|
||||||
import '/@/theme/index.scss';
|
import "/@/theme/index.scss"
|
||||||
|
|
||||||
const app = createApp(App);
|
const app = createApp(App)
|
||||||
|
|
||||||
// 全局自定方法挂载
|
// 全局自定方法挂载
|
||||||
properties(app);
|
properties(app)
|
||||||
// 全局自定义指令挂载
|
// 全局自定义指令挂载
|
||||||
directive(app);
|
directive(app)
|
||||||
|
|
||||||
app
|
app
|
||||||
.use(pinia) // pinia 存储
|
.use(pinia) // pinia 存储
|
||||||
.use(router) // 路由
|
.use(router) // 路由
|
||||||
.use(Components) // 全局引入自定义的组件&第三方的组件
|
.use(Components) // 全局引入自定义的组件&第三方的组件
|
||||||
.use(i18n) // 国际化
|
.use(i18n) // 国际化
|
||||||
.mount('#app');
|
.use(VxeUITable)
|
||||||
|
.mount("#app")
|
||||||
+46
-38
@@ -1,4 +1,4 @@
|
|||||||
import { RouteRecordRaw } from 'vue-router';
|
import { RouteRecordRaw } from "vue-router"
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 建议：路由 path 路径与文件夹名称相同，找文件可浏览器地址找，方便定位文件位置
|
* 建议：路由 path 路径与文件夹名称相同，找文件可浏览器地址找，方便定位文件位置
|
||||||
@@ -18,16 +18,16 @@ import { RouteRecordRaw } from 'vue-router';
|
|||||||
*/
|
*/
|
||||||
|
|
||||||
// 扩展 RouteMeta 接口
|
// 扩展 RouteMeta 接口
|
||||||
declare module 'vue-router' {
|
declare module "vue-router" {
|
||||||
interface RouteMeta {
|
interface RouteMeta {
|
||||||
isLink?: string;
|
isLink?: string
|
||||||
isHide?: boolean;
|
isHide?: boolean
|
||||||
isAuth?: boolean;
|
isAuth?: boolean
|
||||||
isKeepAlive?: boolean;
|
isKeepAlive?: boolean
|
||||||
isAffix?: boolean;
|
isAffix?: boolean
|
||||||
isIframe?: boolean;
|
isIframe?: boolean
|
||||||
roles?: string[];
|
roles?: string[]
|
||||||
icon?: string;
|
icon?: string
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -37,71 +37,79 @@ declare module 'vue-router' {
|
|||||||
*/
|
*/
|
||||||
export const dynamicRoutes: Array<RouteRecordRaw> = [
|
export const dynamicRoutes: Array<RouteRecordRaw> = [
|
||||||
{
|
{
|
||||||
path: '/home',
|
path: "/home",
|
||||||
name: 'router.home',
|
name: "router.home",
|
||||||
component: () => import('/@/views/home/index.vue'),
|
component: () => import("/@/views/home/index.vue"),
|
||||||
meta: {
|
meta: {
|
||||||
isLink: '',
|
isLink: "",
|
||||||
isHide: false,
|
isHide: false,
|
||||||
isKeepAlive: true,
|
isKeepAlive: true,
|
||||||
isAffix: true,
|
isAffix: true,
|
||||||
isIframe: false,
|
isIframe: false,
|
||||||
icon: 'iconfont icon-shouye',
|
icon: "iconfont icon-shouye",
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
path: '/personal',
|
path: "/personal",
|
||||||
name: 'router.personal',
|
name: "router.personal",
|
||||||
component: () => import('/@/views/admin/system/user/personal.vue'),
|
component: () => import("/@/views/admin/system/user/personal.vue"),
|
||||||
meta: {
|
meta: {
|
||||||
isHide: true,
|
isHide: true,
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
];
|
{
|
||||||
|
path: "/createCgPlan",
|
||||||
|
name: "创建采购计划",
|
||||||
|
component: () => import("/@/views/supermarketerp/smErpCgPlan/createCgPlan.vue"),
|
||||||
|
meta: {
|
||||||
|
isHide: true,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
]
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 定义静态路由（默认路由）
|
* 定义静态路由（默认路由）
|
||||||
*/
|
*/
|
||||||
export const staticRoutes: Array<RouteRecordRaw> = [
|
export const staticRoutes: Array<RouteRecordRaw> = [
|
||||||
{
|
{
|
||||||
path: '/login',
|
path: "/login",
|
||||||
name: 'staticRoutes.login',
|
name: "staticRoutes.login",
|
||||||
component: () => import('/@/views/login/index.vue'),
|
component: () => import("/@/views/login/index.vue"),
|
||||||
meta: {
|
meta: {
|
||||||
isAuth: false,
|
isAuth: false,
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
path: '/authredirect',
|
path: "/authredirect",
|
||||||
name: 'staticRoutes.authredirect',
|
name: "staticRoutes.authredirect",
|
||||||
component: () => import('/@/views/login/component/authredirect.vue'),
|
component: () => import("/@/views/login/component/authredirect.vue"),
|
||||||
meta: {
|
meta: {
|
||||||
isAuth: false,
|
isAuth: false,
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
];
|
]
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 定义404、401界面
|
* 定义404、401界面
|
||||||
*/
|
*/
|
||||||
export const notFoundAndNoPower = [
|
export const notFoundAndNoPower = [
|
||||||
{
|
{
|
||||||
path: '/:path(.*)*',
|
path: "/:path(.*)*",
|
||||||
name: 'staticRoutes.notFound',
|
name: "staticRoutes.notFound",
|
||||||
component: () => import('/@/views/error/404.vue'),
|
component: () => import("/@/views/error/404.vue"),
|
||||||
meta: {
|
meta: {
|
||||||
isHide: true,
|
isHide: true,
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
path: '/401',
|
path: "/401",
|
||||||
name: 'staticRoutes.noPower',
|
name: "staticRoutes.noPower",
|
||||||
component: () => import('/@/views/error/401.vue'),
|
component: () => import("/@/views/error/401.vue"),
|
||||||
meta: {
|
meta: {
|
||||||
isHide: true,
|
isHide: true,
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
];
|
]
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 基础性路由
|
* 基础性路由
|
||||||
@@ -110,13 +118,13 @@ export const notFoundAndNoPower = [
|
|||||||
*/
|
*/
|
||||||
export const baseRoutes: Array<RouteRecordRaw> = [
|
export const baseRoutes: Array<RouteRecordRaw> = [
|
||||||
{
|
{
|
||||||
path: '/',
|
path: "/",
|
||||||
name: '/',
|
name: "/",
|
||||||
component: () => import('/@/layout/index.vue'),
|
component: () => import("/@/layout/index.vue"),
|
||||||
redirect: '/home',
|
redirect: "/home",
|
||||||
meta: {
|
meta: {
|
||||||
isKeepAlive: true,
|
isKeepAlive: true,
|
||||||
},
|
},
|
||||||
children: [],
|
children: [],
|
||||||
},
|
},
|
||||||
];
|
]
|
||||||
@@ -0,0 +1,413 @@
|
|||||||
|
<template>
|
||||||
|
<div class="layout-padding">
|
||||||
|
<div class="layout-padding-auto layout-padding-view" style="overflow: scroll">
|
||||||
|
<el-form ref="dataFormRef" :model="form" :rules="dataRules" formDialogRef label-width="140px" v-loading="loading">
|
||||||
|
<el-row>
|
||||||
|
<el-form-item label="采购计划编号" prop="planCode">
|
||||||
|
<el-input v-model="form.planCode" placeholder="请输入采购计划编号" />
|
||||||
|
</el-form-item>
|
||||||
|
|
||||||
|
<el-form-item label="采购计划单据日期" prop="planDate">
|
||||||
|
<el-input v-model="form.planDate" placeholder="请输入采购计划单据日期" />
|
||||||
|
</el-form-item>
|
||||||
|
|
||||||
|
<el-form-item label="仓库id" prop="warehouseId">
|
||||||
|
<el-input v-model="form.warehouseId" placeholder="请输入仓库id" />
|
||||||
|
</el-form-item>
|
||||||
|
|
||||||
|
<el-form-item label="经办人id" prop="handlerUserId">
|
||||||
|
<el-input v-model="form.handlerUserId" placeholder="请输入经办人id" />
|
||||||
|
</el-form-item>
|
||||||
|
|
||||||
|
<el-form-item label="审批状态" prop="checkStatus">
|
||||||
|
<el-input v-model="form.checkStatus" placeholder="请输入审批状态" />
|
||||||
|
</el-form-item>
|
||||||
|
|
||||||
|
<el-form-item label="审批人id" prop="checkUserId">
|
||||||
|
<el-input v-model="form.checkUserId" placeholder="请输入审批人id" />
|
||||||
|
</el-form-item>
|
||||||
|
|
||||||
|
<el-form-item label="审核日期" prop="checkTime">
|
||||||
|
<el-input v-model="form.checkTime" placeholder="请输入审核日期" />
|
||||||
|
</el-form-item>
|
||||||
|
|
||||||
|
<el-form-item label="商户编号" prop="merchantId">
|
||||||
|
<el-input v-model="form.merchantId" placeholder="请输入商户编号" />
|
||||||
|
</el-form-item>
|
||||||
|
|
||||||
|
<el-form-item label="部门id" prop="deptId">
|
||||||
|
<el-input v-model="form.deptId" placeholder="请输入部门id" />
|
||||||
|
</el-form-item>
|
||||||
|
|
||||||
|
<el-form-item label="出入库数量" prop="quantity">
|
||||||
|
<el-input v-model="form.quantity" placeholder="请输入出入库数量" />
|
||||||
|
</el-form-item>
|
||||||
|
|
||||||
|
<el-form-item label="累计进货数量" prop="totalNumber">
|
||||||
|
<el-input v-model="form.totalNumber" placeholder="请输入累计进货数量" />
|
||||||
|
</el-form-item>
|
||||||
|
|
||||||
|
<el-form-item label="累计总金额" prop="totalAmount">
|
||||||
|
<el-input v-model="form.totalAmount" placeholder="请输入累计总金额" />
|
||||||
|
</el-form-item>
|
||||||
|
|
||||||
|
<el-form-item label="货商" prop="supplierId">
|
||||||
|
<el-input v-model="form.supplierId" placeholder="请输入货商" />
|
||||||
|
</el-form-item>
|
||||||
|
|
||||||
|
<el-form-item label="备注" prop="remark">
|
||||||
|
<el-input v-model="form.remark" placeholder="请输入备注" />
|
||||||
|
</el-form-item>
|
||||||
|
|
||||||
|
<el-form-item label="订单编号" prop="orderNumber">
|
||||||
|
<el-input v-model="form.orderNumber" placeholder="请输入订单编号" />
|
||||||
|
</el-form-item>
|
||||||
|
</el-row>
|
||||||
|
</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.insertRowNumber"
|
||||||
|
:min="0"
|
||||||
|
:max="state.tableData.length"
|
||||||
|
:precision="0"
|
||||||
|
size="small"
|
||||||
|
controls-position="right"
|
||||||
|
style="min-width: 50px; margin: 0 5px"
|
||||||
|
/>
|
||||||
|
行新增
|
||||||
|
</el-button>
|
||||||
|
<el-button @click="removeSelectRowEvent" :disabled="state.selectedRowsIds.length <= 0">删除选中</el-button>
|
||||||
|
</el-row>
|
||||||
|
|
||||||
|
<vxe-table
|
||||||
|
ref="tableRef"
|
||||||
|
border
|
||||||
|
:loading="loading"
|
||||||
|
show-overflow
|
||||||
|
max-height="400"
|
||||||
|
:edit-config="{
|
||||||
|
trigger: 'click',
|
||||||
|
mode: 'cell',
|
||||||
|
beforeEditMethod({ row, column }:any) {
|
||||||
|
// name 为 'x' 开头的列禁止编辑
|
||||||
|
if (column.property === 'quantity') {
|
||||||
|
return false
|
||||||
|
}
|
||||||
|
return true
|
||||||
|
},
|
||||||
|
}"
|
||||||
|
:column-config="{ resizable: true }"
|
||||||
|
:row-config="{ isHover: true }"
|
||||||
|
:resizable-config="{ dragMode: 'fixed' }"
|
||||||
|
:data="state.tableData"
|
||||||
|
:edit-rules="validRules"
|
||||||
|
@checkbox-all="selectChangeEvent"
|
||||||
|
@checkbox-change="selectChangeEvent"
|
||||||
|
size="mini"
|
||||||
|
empty-text="无数据"
|
||||||
|
align="center"
|
||||||
|
>
|
||||||
|
<vxe-column type="checkbox" width="40" fixed="left"></vxe-column>
|
||||||
|
|
||||||
|
<vxe-column type="seq" width="70" fixed="left"></vxe-column>
|
||||||
|
|
||||||
|
<vxe-column field="planId" title="采购id" :edit-render="{ autoFocus: 'input', placeholder: '请输入' }">
|
||||||
|
<template #edit="{ row }">
|
||||||
|
<el-input v-model="row.planId" />
|
||||||
|
</template>
|
||||||
|
</vxe-column>
|
||||||
|
|
||||||
|
<vxe-column field="erpSpuId" title="库存商品id" :edit-render="{ autoFocus: 'input', placeholder: '请输入' }">
|
||||||
|
<template #edit="{ row }">
|
||||||
|
<el-input v-model="row.erpSpuId" />
|
||||||
|
</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-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="进价" :edit-render="{ autoFocus: 'input', placeholder: '请输入' }">
|
||||||
|
<template #edit="{ row }">
|
||||||
|
<el-input v-model="row.unitPrice" />
|
||||||
|
</template>
|
||||||
|
</vxe-column>
|
||||||
|
|
||||||
|
<vxe-column field="totalAmount" title="累计总金额" :edit-render="{ autoFocus: 'input', placeholder: '请输入' }">
|
||||||
|
<template #edit="{ row }">
|
||||||
|
<el-input v-model="row.totalAmount" />
|
||||||
|
</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="unitId" title="包装单位id" :edit-render="{ autoFocus: 'input', placeholder: '请输入' }">
|
||||||
|
<template #edit="{ row }">
|
||||||
|
<el-input v-model="row.unitId" />
|
||||||
|
</template>
|
||||||
|
</vxe-column>
|
||||||
|
</vxe-table>
|
||||||
|
|
||||||
|
<el-row class="my-3">
|
||||||
|
<el-button type="primary" plain @click="onSubmit">取消</el-button>
|
||||||
|
<el-button type="primary" plain @click="onSubmit">继续添加</el-button>
|
||||||
|
<el-button type="primary" plain @click="onSubmit">保存</el-button>
|
||||||
|
</el-row>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup lang="ts" name="SmErpCgPlanDialog">
|
||||||
|
import { useDict } from "/@/hooks/dict"
|
||||||
|
import { useMessage } from "/@/hooks/message"
|
||||||
|
import { getObj, addObj, putObj } from "/@/api/supermarketerp/smErpCgPlan"
|
||||||
|
import { VxeTableEvents, VxeTablePropTypes, VxeUI, type VxeTableInstance } from "vxe-table"
|
||||||
|
|
||||||
|
interface RowVO {
|
||||||
|
id: string
|
||||||
|
planId: string
|
||||||
|
erpSpuId: string
|
||||||
|
merchantId: string
|
||||||
|
deptId: string
|
||||||
|
quantity: number | null
|
||||||
|
unitPrice: number | null
|
||||||
|
totalAmount: number | null
|
||||||
|
remark: string
|
||||||
|
unitId: string
|
||||||
|
}
|
||||||
|
|
||||||
|
// 定义变量内容
|
||||||
|
const loading = ref(false)
|
||||||
|
const dataFormRef = ref()
|
||||||
|
const tableRef = ref<VxeTableInstance<RowVO>>()
|
||||||
|
|
||||||
|
// 提交表单数据
|
||||||
|
const form = reactive({
|
||||||
|
id: "",
|
||||||
|
planCode: "",
|
||||||
|
planDate: "",
|
||||||
|
warehouseId: "",
|
||||||
|
handlerUserId: "",
|
||||||
|
checkStatus: "",
|
||||||
|
checkUserId: "",
|
||||||
|
checkTime: "",
|
||||||
|
merchantId: "",
|
||||||
|
deptId: "",
|
||||||
|
quantity: "",
|
||||||
|
totalNumber: "",
|
||||||
|
totalAmount: "",
|
||||||
|
supplierId: "",
|
||||||
|
remark: "",
|
||||||
|
orderNumber: "",
|
||||||
|
})
|
||||||
|
const state = reactive<{
|
||||||
|
tableData: RowVO[]
|
||||||
|
insertRecords: RowVO[]
|
||||||
|
selectedRowsIds: string[]
|
||||||
|
insertRowNumber: number
|
||||||
|
}>({
|
||||||
|
tableData: [
|
||||||
|
{
|
||||||
|
id: "11",
|
||||||
|
planId: "11",
|
||||||
|
erpSpuId: "11",
|
||||||
|
merchantId: "11",
|
||||||
|
deptId: "11",
|
||||||
|
quantity: 11,
|
||||||
|
unitPrice: 11,
|
||||||
|
totalAmount: 11,
|
||||||
|
remark: "11",
|
||||||
|
unitId: "11",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "22",
|
||||||
|
planId: "22",
|
||||||
|
erpSpuId: "22",
|
||||||
|
merchantId: "22",
|
||||||
|
deptId: "22",
|
||||||
|
quantity: 11,
|
||||||
|
unitPrice: 11,
|
||||||
|
totalAmount: 11,
|
||||||
|
remark: "22",
|
||||||
|
unitId: "22",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
insertRecords: [],
|
||||||
|
selectedRowsIds: [],
|
||||||
|
insertRowNumber: 0,
|
||||||
|
})
|
||||||
|
|
||||||
|
// 定义校验规则
|
||||||
|
const dataRules = ref({
|
||||||
|
planCode: [{ required: true, message: "采购计划编号不能为空", trigger: "blur" }],
|
||||||
|
planDate: [{ required: true, message: "采购计划单据日期不能为空", trigger: "blur" }],
|
||||||
|
})
|
||||||
|
|
||||||
|
// 表格校验规则
|
||||||
|
const validRules = ref<VxeTablePropTypes.EditRules<RowVO>>({
|
||||||
|
planId: [{ required: true, message: "必须填写" }],
|
||||||
|
totalAmount: [{ required: true, type: "number", min: 18, max: 28, message: "数值范围18~28" }],
|
||||||
|
})
|
||||||
|
|
||||||
|
// 表格行勾选
|
||||||
|
const selectChangeEvent: VxeTableEvents.CheckboxChange<RowVO> = ({ checked }) => {
|
||||||
|
const $table = tableRef.value
|
||||||
|
if ($table) {
|
||||||
|
const records = $table.getCheckboxRecords()
|
||||||
|
console.log(checked ? "勾选事件" : "取消事件", records)
|
||||||
|
state.selectedRowsIds = records.map((item) => item.id)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 顶部表格行新增
|
||||||
|
const addEvent = () => {
|
||||||
|
const newRow: RowVO = {
|
||||||
|
id: "22",
|
||||||
|
planId: "",
|
||||||
|
erpSpuId: "",
|
||||||
|
merchantId: "",
|
||||||
|
deptId: "",
|
||||||
|
quantity: null,
|
||||||
|
unitPrice: null,
|
||||||
|
totalAmount: null,
|
||||||
|
remark: "",
|
||||||
|
unitId: "",
|
||||||
|
}
|
||||||
|
state.tableData.unshift(newRow)
|
||||||
|
state.insertRecords.push(newRow)
|
||||||
|
nextTick(() => {
|
||||||
|
const $table = tableRef.value
|
||||||
|
if ($table) {
|
||||||
|
$table.setEditRow(newRow)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 底部表格行新增
|
||||||
|
const pushEvent = () => {
|
||||||
|
const newRow: RowVO = {
|
||||||
|
id: "22",
|
||||||
|
planId: "",
|
||||||
|
erpSpuId: "",
|
||||||
|
merchantId: "",
|
||||||
|
deptId: "",
|
||||||
|
quantity: null,
|
||||||
|
unitPrice: null,
|
||||||
|
totalAmount: null,
|
||||||
|
remark: "",
|
||||||
|
unitId: "",
|
||||||
|
}
|
||||||
|
state.tableData.push(newRow)
|
||||||
|
state.insertRecords.push(newRow)
|
||||||
|
nextTick(() => {
|
||||||
|
const $table = tableRef.value
|
||||||
|
if ($table) {
|
||||||
|
$table.setEditRow(newRow)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 在指定行插入
|
||||||
|
const insertEvent = () => {
|
||||||
|
const newRow: RowVO = {
|
||||||
|
id: "22",
|
||||||
|
planId: "",
|
||||||
|
erpSpuId: "",
|
||||||
|
merchantId: "",
|
||||||
|
deptId: "",
|
||||||
|
quantity: null,
|
||||||
|
unitPrice: null,
|
||||||
|
totalAmount: null,
|
||||||
|
remark: "",
|
||||||
|
unitId: "",
|
||||||
|
}
|
||||||
|
state.tableData.splice(state.insertRowNumber, 0, newRow)
|
||||||
|
state.insertRecords.push(newRow)
|
||||||
|
nextTick(() => {
|
||||||
|
const $table = tableRef.value
|
||||||
|
if ($table) {
|
||||||
|
$table.setEditRow(newRow)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 删除选中的行
|
||||||
|
const removeSelectRowEvent = () => {
|
||||||
|
const $table = tableRef.value
|
||||||
|
if ($table) {
|
||||||
|
const selectRecords = $table.getCheckboxRecords()
|
||||||
|
if (selectRecords.length > 0) {
|
||||||
|
state.tableData = state.tableData.filter((item) => !selectRecords.some((row) => row.id === item.id))
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 提交
|
||||||
|
const onSubmit = async () => {
|
||||||
|
console.log(state.tableData)
|
||||||
|
|
||||||
|
// 全量校验
|
||||||
|
const $table = tableRef.value
|
||||||
|
if ($table) {
|
||||||
|
const errMap = await $table.validate(true)
|
||||||
|
if (errMap) {
|
||||||
|
console.log("全量校验失败！")
|
||||||
|
return
|
||||||
|
} else {
|
||||||
|
console.log("全量校验成功！")
|
||||||
|
return
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// const onSubmit = async () => {
|
||||||
|
// const valid = await dataFormRef.value.validate().catch(() => {})
|
||||||
|
// if (!valid) return false
|
||||||
|
|
||||||
|
// try {
|
||||||
|
// loading.value = true
|
||||||
|
// form.id ? await putObj(form) : await addObj(form)
|
||||||
|
// useMessage().success(form.id ? "修改成功" : "添加成功")
|
||||||
|
// } catch (err: any) {
|
||||||
|
// useMessage().error(err.msg)
|
||||||
|
// } finally {
|
||||||
|
// loading.value = false
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
|
||||||
|
// 初始化表单数据
|
||||||
|
// const getsmErpCgPlanData = (id: string) => {
|
||||||
|
// // 获取数据
|
||||||
|
// loading.value = true
|
||||||
|
// getObj(id)
|
||||||
|
// .then((res: any) => {
|
||||||
|
// Object.assign(form, res.data)
|
||||||
|
// })
|
||||||
|
// .finally(() => {
|
||||||
|
// loading.value = false
|
||||||
|
// })
|
||||||
|
// }
|
||||||
|
</script>
|
||||||
@@ -1,197 +1,196 @@
|
|||||||
<template>
|
<template>
|
||||||
<el-dialog :title="form.id ? '编辑' : '新增'" v-model="visible"
|
<el-dialog :title="form.id ? '编辑' : '新增'" v-model="visible" :close-on-click-modal="false" draggable>
|
||||||
:close-on-click-modal="false" draggable>
|
<el-form ref="dataFormRef" :model="form" :rules="dataRules" formDialogRef label-width="90px" v-loading="loading">
|
||||||
<el-form ref="dataFormRef" :model="form" :rules="dataRules" formDialogRef label-width="90px" v-loading="loading">
|
<el-row :gutter="24">
|
||||||
<el-row :gutter="24">
|
<el-col :span="12" class="mb20">
|
||||||
<el-col :span="12" class="mb20">
|
<el-form-item label="采购计划编号" prop="planCode">
|
||||||
<el-form-item label="采购计划编号" prop="planCode">
|
<el-input v-model="form.planCode" placeholder="请输入采购计划编号" />
|
||||||
<el-input v-model="form.planCode" placeholder="请输入采购计划编号"/>
|
</el-form-item>
|
||||||
</el-form-item>
|
</el-col>
|
||||||
</el-col>
|
|
||||||
|
|
||||||
<el-col :span="12" class="mb20">
|
<el-col :span="12" class="mb20">
|
||||||
<el-form-item label="采购计划单据日期" prop="planDate">
|
<el-form-item label="采购计划单据日期" prop="planDate">
|
||||||
<el-input v-model="form.planDate" placeholder="请输入采购计划单据日期"/>
|
<el-input v-model="form.planDate" placeholder="请输入采购计划单据日期" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
|
|
||||||
<el-col :span="12" class="mb20">
|
<el-col :span="12" class="mb20">
|
||||||
<el-form-item label="仓库id" prop="warehouseId">
|
<el-form-item label="仓库id" prop="warehouseId">
|
||||||
<el-input v-model="form.warehouseId" placeholder="请输入仓库id"/>
|
<el-input v-model="form.warehouseId" placeholder="请输入仓库id" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
|
|
||||||
<el-col :span="12" class="mb20">
|
<el-col :span="12" class="mb20">
|
||||||
<el-form-item label="经办人id" prop="handlerUserId">
|
<el-form-item label="经办人id" prop="handlerUserId">
|
||||||
<el-input v-model="form.handlerUserId" placeholder="请输入经办人id"/>
|
<el-input v-model="form.handlerUserId" placeholder="请输入经办人id" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
|
|
||||||
<el-col :span="12" class="mb20">
|
<el-col :span="12" class="mb20">
|
||||||
<el-form-item label="审批状态" prop="checkStatus">
|
<el-form-item label="审批状态" prop="checkStatus">
|
||||||
<el-input v-model="form.checkStatus" placeholder="请输入审批状态"/>
|
<el-input v-model="form.checkStatus" placeholder="请输入审批状态" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
|
|
||||||
<el-col :span="12" class="mb20">
|
<el-col :span="12" class="mb20">
|
||||||
<el-form-item label="审批人id" prop="checkUserId">
|
<el-form-item label="审批人id" prop="checkUserId">
|
||||||
<el-input v-model="form.checkUserId" placeholder="请输入审批人id"/>
|
<el-input v-model="form.checkUserId" placeholder="请输入审批人id" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
|
|
||||||
<el-col :span="12" class="mb20">
|
<el-col :span="12" class="mb20">
|
||||||
<el-form-item label="审核日期" prop="checkTime">
|
<el-form-item label="审核日期" prop="checkTime">
|
||||||
<el-input v-model="form.checkTime" placeholder="请输入审核日期"/>
|
<el-input v-model="form.checkTime" placeholder="请输入审核日期" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
|
|
||||||
<el-col :span="12" class="mb20">
|
<el-col :span="12" class="mb20">
|
||||||
<el-form-item label="商户编号" prop="merchantId">
|
<el-form-item label="商户编号" prop="merchantId">
|
||||||
<el-input v-model="form.merchantId" placeholder="请输入商户编号"/>
|
<el-input v-model="form.merchantId" placeholder="请输入商户编号" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
|
|
||||||
<el-col :span="12" class="mb20">
|
<el-col :span="12" class="mb20">
|
||||||
<el-form-item label="部门id" prop="deptId">
|
<el-form-item label="部门id" prop="deptId">
|
||||||
<el-input v-model="form.deptId" placeholder="请输入部门id"/>
|
<el-input v-model="form.deptId" placeholder="请输入部门id" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
|
|
||||||
<el-col :span="12" class="mb20">
|
<el-col :span="12" class="mb20">
|
||||||
<el-form-item label="出入库数量" prop="quantity">
|
<el-form-item label="出入库数量" prop="quantity">
|
||||||
<el-input v-model="form.quantity" placeholder="请输入出入库数量"/>
|
<el-input v-model="form.quantity" placeholder="请输入出入库数量" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
|
|
||||||
<el-col :span="12" class="mb20">
|
<el-col :span="12" class="mb20">
|
||||||
<el-form-item label="累计进货数量" prop="totalNumber">
|
<el-form-item label="累计进货数量" prop="totalNumber">
|
||||||
<el-input v-model="form.totalNumber" placeholder="请输入累计进货数量"/>
|
<el-input v-model="form.totalNumber" placeholder="请输入累计进货数量" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
|
|
||||||
<el-col :span="12" class="mb20">
|
<el-col :span="12" class="mb20">
|
||||||
<el-form-item label="累计总金额" prop="totalAmount">
|
<el-form-item label="累计总金额" prop="totalAmount">
|
||||||
<el-input v-model="form.totalAmount" placeholder="请输入累计总金额"/>
|
<el-input v-model="form.totalAmount" placeholder="请输入累计总金额" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
|
|
||||||
<el-col :span="12" class="mb20">
|
<el-col :span="12" class="mb20">
|
||||||
<el-form-item label="货商" prop="supplierId">
|
<el-form-item label="货商" prop="supplierId">
|
||||||
<el-input v-model="form.supplierId" placeholder="请输入货商"/>
|
<el-input v-model="form.supplierId" placeholder="请输入货商" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
|
|
||||||
<el-col :span="12" class="mb20">
|
<el-col :span="12" class="mb20">
|
||||||
<el-form-item label="备注" prop="remark">
|
<el-form-item label="备注" prop="remark">
|
||||||
<el-input v-model="form.remark" placeholder="请输入备注"/>
|
<el-input v-model="form.remark" placeholder="请输入备注" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
|
|
||||||
<el-col :span="12" class="mb20">
|
|
||||||
<el-form-item label="订单编号" prop="orderNumber">
|
|
||||||
<el-input v-model="form.orderNumber" placeholder="请输入订单编号"/>
|
|
||||||
</el-form-item>
|
|
||||||
</el-col>
|
|
||||||
|
|
||||||
|
<el-col :span="12" class="mb20">
|
||||||
|
<el-form-item label="订单编号" prop="orderNumber">
|
||||||
|
<el-input v-model="form.orderNumber" placeholder="请输入订单编号" />
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
</el-row>
|
</el-row>
|
||||||
</el-form>
|
</el-form>
|
||||||
<template #footer>
|
<template #footer>
|
||||||
<span class="dialog-footer">
|
<span class="dialog-footer">
|
||||||
<el-button @click="visible = false">取消</el-button>
|
<el-button @click="visible = false">取消</el-button>
|
||||||
<el-button type="primary" @click="onSubmit" :disabled="loading">确认</el-button>
|
<el-button type="primary" @click="onSubmit" :disabled="loading">确认</el-button>
|
||||||
</span>
|
</span>
|
||||||
</template>
|
</template>
|
||||||
</el-dialog>
|
</el-dialog>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts" name="SmErpCgPlanDialog">
|
<script setup lang="ts" name="SmErpCgPlanDialog">
|
||||||
import { useDict } from '/@/hooks/dict';
|
import { useDict } from "/@/hooks/dict"
|
||||||
import { useMessage } from "/@/hooks/message";
|
import { useMessage } from "/@/hooks/message"
|
||||||
import { getObj, addObj, putObj } from '/src/api/supermarketerp/smErpCgPlan'
|
import { getObj, addObj, putObj } from "/@/api/supermarketerp/smErpCgPlan"
|
||||||
import { rule } from '/@/utils/validate';
|
import { rule } from "/@/utils/validate"
|
||||||
const emit = defineEmits(['refresh']);
|
const emit = defineEmits(["refresh"])
|
||||||
|
|
||||||
// 定义变量内容
|
// 定义变量内容
|
||||||
const dataFormRef = ref();
|
const dataFormRef = ref()
|
||||||
const visible = ref(false)
|
const visible = ref(false)
|
||||||
const loading = ref(false)
|
const loading = ref(false)
|
||||||
// 定义字典
|
// 定义字典
|
||||||
|
|
||||||
// 提交表单数据
|
// 提交表单数据
|
||||||
const form = reactive({
|
const form = reactive({
|
||||||
id:'',
|
id: "",
|
||||||
planCode: '',
|
planCode: "",
|
||||||
planDate: '',
|
planDate: "",
|
||||||
warehouseId: '',
|
warehouseId: "",
|
||||||
handlerUserId: '',
|
handlerUserId: "",
|
||||||
checkStatus: '',
|
checkStatus: "",
|
||||||
checkUserId: '',
|
checkUserId: "",
|
||||||
checkTime: '',
|
checkTime: "",
|
||||||
merchantId: '',
|
merchantId: "",
|
||||||
deptId: '',
|
deptId: "",
|
||||||
quantity: '',
|
quantity: "",
|
||||||
totalNumber: '',
|
totalNumber: "",
|
||||||
totalAmount: '',
|
totalAmount: "",
|
||||||
supplierId: '',
|
supplierId: "",
|
||||||
remark: '',
|
remark: "",
|
||||||
orderNumber: '',
|
orderNumber: "",
|
||||||
});
|
})
|
||||||
|
|
||||||
// 定义校验规则
|
// 定义校验规则
|
||||||
const dataRules = ref({
|
const dataRules = ref({
|
||||||
planCode: [{required: true, message: '采购计划编号不能为空', trigger: 'blur'}],
|
planCode: [{ required: true, message: "采购计划编号不能为空", trigger: "blur" }],
|
||||||
planDate: [{required: true, message: '采购计划单据日期不能为空', trigger: 'blur'}],
|
planDate: [{ required: true, message: "采购计划单据日期不能为空", trigger: "blur" }],
|
||||||
})
|
})
|
||||||
|
|
||||||
// 打开弹窗
|
// 打开弹窗
|
||||||
const openDialog = (id: string) => {
|
const openDialog = (id: string) => {
|
||||||
visible.value = true
|
visible.value = true
|
||||||
form.id = ''
|
form.id = ""
|
||||||
|
|
||||||
// 重置表单数据
|
// 重置表单数据
|
||||||
nextTick(() => {
|
nextTick(() => {
|
||||||
dataFormRef.value?.resetFields();
|
dataFormRef.value?.resetFields()
|
||||||
});
|
})
|
||||||
|
|
||||||
// 获取smErpCgPlan信息
|
// 获取smErpCgPlan信息
|
||||||
if (id) {
|
if (id) {
|
||||||
form.id = id
|
form.id = id
|
||||||
getsmErpCgPlanData(id)
|
getsmErpCgPlanData(id)
|
||||||
}
|
}
|
||||||
};
|
}
|
||||||
|
|
||||||
// 提交
|
// 提交
|
||||||
const onSubmit = async () => {
|
const onSubmit = async () => {
|
||||||
const valid = await dataFormRef.value.validate().catch(() => {});
|
const valid = await dataFormRef.value.validate().catch(() => {})
|
||||||
if (!valid) return false;
|
if (!valid) return false
|
||||||
|
|
||||||
try {
|
try {
|
||||||
loading.value = true;
|
loading.value = true
|
||||||
form.id ? await putObj(form) : await addObj(form);
|
form.id ? await putObj(form) : await addObj(form)
|
||||||
useMessage().success(form.id ? '修改成功' : '添加成功');
|
useMessage().success(form.id ? "修改成功" : "添加成功")
|
||||||
visible.value = false;
|
visible.value = false
|
||||||
emit('refresh');
|
emit("refresh")
|
||||||
} catch (err: any) {
|
} catch (err: any) {
|
||||||
useMessage().error(err.msg);
|
useMessage().error(err.msg)
|
||||||
} finally {
|
} finally {
|
||||||
loading.value = false;
|
loading.value = false
|
||||||
}
|
}
|
||||||
};
|
}
|
||||||
|
|
||||||
|
|
||||||
// 初始化表单数据
|
// 初始化表单数据
|
||||||
const getsmErpCgPlanData = (id: string) => {
|
const getsmErpCgPlanData = (id: string) => {
|
||||||
// 获取数据
|
// 获取数据
|
||||||
loading.value = true
|
loading.value = true
|
||||||
getObj(id).then((res: any) => {
|
getObj(id)
|
||||||
Object.assign(form, res.data)
|
.then((res: any) => {
|
||||||
}).finally(() => {
|
Object.assign(form, res.data)
|
||||||
loading.value = false
|
})
|
||||||
})
|
.finally(() => {
|
||||||
};
|
loading.value = false
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
// 暴露变量
|
// 暴露变量
|
||||||
defineExpose({
|
defineExpose({
|
||||||
openDialog
|
openDialog,
|
||||||
});
|
})
|
||||||
</script>
|
</script>
|
||||||
@@ -1,94 +1,125 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="layout-padding">
|
<div class="layout-padding">
|
||||||
<div class="layout-padding-auto layout-padding-view">
|
<div class="layout-padding-auto layout-padding-view">
|
||||||
<el-row v-show="showSearch">
|
<el-row v-show="showSearch">
|
||||||
<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
|
<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
|
||||||
<el-form-item label="采购计划编号" prop="planCode" >
|
<el-form-item label="采购计划编号" prop="planCode">
|
||||||
<el-input placeholder="请输入采购计划编号" v-model="state.queryForm.planCode" />
|
<el-input placeholder="请输入采购计划编号" v-model="state.queryForm.planCode" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="采购计划单据日期" prop="planDate">
|
<el-form-item label="采购计划单据日期" prop="planDate">
|
||||||
<el-date-picker type="date" placeholder="请输入采购计划单据日期" v-model="state.queryForm.planDate"></el-date-picker>
|
<el-date-picker type="date" placeholder="请输入采购计划单据日期" v-model="state.queryForm.planDate" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="经办人id" prop="handlerUserId">
|
<el-form-item label="经办人id" prop="handlerUserId">
|
||||||
<el-select v-model="state.queryForm.handlerUserId" placeholder="请选择经办人id">
|
<el-select v-model="state.queryForm.handlerUserId" placeholder="请选择经办人id">
|
||||||
<el-option label="请选择">0</el-option>
|
<el-option label="请选择" value="00" />
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="审批状态" prop="checkStatus">
|
<el-form-item label="审批状态" prop="checkStatus">
|
||||||
<el-select v-model="state.queryForm.checkStatus" placeholder="请选择审批状态">
|
<el-select v-model="state.queryForm.checkStatus" placeholder="请选择审批状态">
|
||||||
<el-option label="请选择">0</el-option>
|
<el-option label="请选择" value="00" />
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item>
|
<el-form-item>
|
||||||
<el-button icon="search" type="primary" @click="getDataList">
|
<el-button icon="search" type="primary" @click="getDataList">查询</el-button>
|
||||||
查询
|
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
|
||||||
</el-button>
|
</el-form-item>
|
||||||
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
|
</el-form>
|
||||||
</el-form-item>
|
</el-row>
|
||||||
</el-form>
|
<el-row>
|
||||||
</el-row>
|
<div class="mb8" style="width: 100%">
|
||||||
<el-row>
|
<el-button
|
||||||
<div class="mb8" style="width: 100%">
|
icon="folder-add"
|
||||||
<el-button icon="folder-add" type="primary" class="ml10" @click="formDialogRef.openDialog()"
|
type="primary"
|
||||||
v-auth="'supermarket_smErpCgPlan_add'">
|
class="ml10"
|
||||||
新 增
|
@click="handleClickCreateCgPlan"
|
||||||
</el-button>
|
v-auth="'supermarket_smErpCgPlan_add'"
|
||||||
<el-button plain :disabled="multiple" icon="Delete" type="primary"
|
>
|
||||||
v-auth="'supermarket_smErpCgPlan_del'" @click="handleDelete(selectObjs)">
|
新 增
|
||||||
删除
|
</el-button>
|
||||||
</el-button>
|
<el-button
|
||||||
<right-toolbar v-model:showSearch="showSearch" :export="'supermarket_smErpCgPlan_export'"
|
plain
|
||||||
@exportExcel="exportExcel" class="ml10 mr20" style="float: right;"
|
:disabled="multiple"
|
||||||
@queryTable="getDataList"></right-toolbar>
|
icon="Delete"
|
||||||
</div>
|
type="primary"
|
||||||
</el-row>
|
v-auth="'supermarket_smErpCgPlan_del'"
|
||||||
<el-table :data="state.dataList" v-loading="state.loading" border
|
@click="handleDelete(selectObjs)"
|
||||||
:cell-style="tableStyle.cellStyle" :header-cell-style="tableStyle.headerCellStyle"
|
>
|
||||||
|
删 除
|
||||||
|
</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"
|
@selection-change="selectionChangHandle"
|
||||||
@sort-change="sortChangeHandle">
|
@sort-change="sortChangeHandle"
|
||||||
<el-table-column type="selection" width="40" align="center" />
|
>
|
||||||
<el-table-column type="index" label="#" width="40" />
|
<el-table-column type="selection" width="40" align="center" />
|
||||||
<el-table-column prop="planCode" label="采购计划编号" show-overflow-tooltip/>
|
<el-table-column type="index" label="#" width="50" />
|
||||||
<el-table-column prop="planDate" label="采购计划单据日期" show-overflow-tooltip/>
|
<el-table-column prop="planCode" label="采购计划编号" show-overflow-tooltip />
|
||||||
<el-table-column prop="warehouseId" label="仓库id" show-overflow-tooltip/>
|
<el-table-column prop="planDate" label="采购计划单据日期" show-overflow-tooltip />
|
||||||
<el-table-column prop="handlerUserId" label="经办人id" show-overflow-tooltip/>
|
<el-table-column prop="warehouseId" label="仓库id" show-overflow-tooltip />
|
||||||
<el-table-column prop="checkStatus" label="审批状态" show-overflow-tooltip/>
|
<el-table-column prop="handlerUserId" label="经办人id" show-overflow-tooltip />
|
||||||
<el-table-column prop="checkUserId" label="审批人id" show-overflow-tooltip/>
|
<el-table-column prop="checkStatus" label="审批状态" show-overflow-tooltip />
|
||||||
<el-table-column prop="checkTime" label="审核日期" show-overflow-tooltip/>
|
<el-table-column prop="checkUserId" label="审批人id" show-overflow-tooltip />
|
||||||
<el-table-column prop="merchantId" label="商户编号" show-overflow-tooltip/>
|
<el-table-column prop="checkTime" label="审核日期" show-overflow-tooltip />
|
||||||
<el-table-column prop="deptId" label="部门id" show-overflow-tooltip/>
|
<el-table-column prop="merchantId" label="商户编号" show-overflow-tooltip />
|
||||||
<el-table-column prop="quantity" label="出入库数量" show-overflow-tooltip/>
|
<el-table-column prop="deptId" label="部门id" show-overflow-tooltip />
|
||||||
<el-table-column prop="totalNumber" label="累计进货数量" show-overflow-tooltip/>
|
<el-table-column prop="quantity" label="出入库数量" show-overflow-tooltip />
|
||||||
<el-table-column prop="totalAmount" label="累计总金额" show-overflow-tooltip/>
|
<el-table-column prop="totalNumber" label="累计进货数量" show-overflow-tooltip />
|
||||||
<el-table-column prop="supplierId" label="货商" show-overflow-tooltip/>
|
<el-table-column prop="totalAmount" label="累计总金额" show-overflow-tooltip />
|
||||||
<el-table-column prop="remark" label="备注" show-overflow-tooltip/>
|
<el-table-column prop="supplierId" label="货商" show-overflow-tooltip />
|
||||||
<el-table-column prop="orderNumber" label="订单编号" show-overflow-tooltip/>
|
<el-table-column prop="remark" label="备注" show-overflow-tooltip />
|
||||||
<el-table-column label="操作" width="150">
|
<el-table-column prop="orderNumber" label="订单编号" show-overflow-tooltip />
|
||||||
<template #default="scope">
|
<el-table-column label="操作" width="150">
|
||||||
<el-button icon="edit-pen" text type="primary" v-auth="'supermarket_smErpCgPlan_edit'"
|
<template #default="scope">
|
||||||
@click="formDialogRef.openDialog(scope.row.id)">编辑</el-button>
|
<el-button
|
||||||
<el-button icon="delete" text type="primary" v-auth="'supermarket_smErpCgPlan_del'" @click="handleDelete([scope.row.id])">删除</el-button>
|
icon="edit-pen"
|
||||||
</template>
|
text
|
||||||
</el-table-column>
|
type="primary"
|
||||||
</el-table>
|
v-auth="'supermarket_smErpCgPlan_edit'"
|
||||||
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
|
@click="formDialogRef.openDialog(scope.row.id)"
|
||||||
</div>
|
>
|
||||||
|
编辑
|
||||||
|
</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>
|
||||||
|
|
||||||
<!-- 编辑、新增 -->
|
<!-- 编辑、新增 -->
|
||||||
<form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
|
<!-- <form-dialog ref="formDialogRef" @refresh="getDataList(false)" /> -->
|
||||||
|
</div>
|
||||||
</div>
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts" name="systemSmErpCgPlan">
|
<script setup lang="ts" name="systemSmErpCgPlan">
|
||||||
import { BasicTableProps, useTable } from "/@/hooks/table";
|
import { BasicTableProps, useTable } from "/@/hooks/table"
|
||||||
import { fetchList, delObjs } from "/src/api/supermarketerp/smErpCgPlan";
|
import { fetchList, delObjs } from "/@/api/supermarketerp/smErpCgPlan"
|
||||||
import { useMessage, useMessageBox } from "/@/hooks/message";
|
import { useMessage, useMessageBox } from "/@/hooks/message"
|
||||||
import { useDict } from '/@/hooks/dict';
|
|
||||||
|
|
||||||
// 引入组件
|
// 引入组件
|
||||||
const FormDialog = defineAsyncComponent(() => import('./form.vue'));
|
// const FormDialog = defineAsyncComponent(() => import("./form.vue"))
|
||||||
// 定义查询字典
|
|
||||||
|
|
||||||
// 定义变量内容
|
// 定义变量内容
|
||||||
const formDialogRef = ref()
|
const formDialogRef = ref()
|
||||||
@@ -100,54 +131,62 @@ const selectObjs = ref([]) as any
|
|||||||
const multiple = ref(true)
|
const multiple = ref(true)
|
||||||
|
|
||||||
const state: BasicTableProps = reactive<BasicTableProps>({
|
const state: BasicTableProps = reactive<BasicTableProps>({
|
||||||
queryForm: {},
|
queryForm: {},
|
||||||
pageList: fetchList
|
pageList: fetchList,
|
||||||
})
|
})
|
||||||
|
|
||||||
// table hook
|
// table hook
|
||||||
const {
|
const { getDataList, currentChangeHandle, sizeChangeHandle, sortChangeHandle, downBlobFile, tableStyle } =
|
||||||
getDataList,
|
useTable(state)
|
||||||
currentChangeHandle,
|
|
||||||
sizeChangeHandle,
|
|
||||||
sortChangeHandle,
|
|
||||||
downBlobFile,
|
|
||||||
tableStyle
|
|
||||||
} = useTable(state)
|
|
||||||
|
|
||||||
// 清空搜索条件
|
// 清空搜索条件
|
||||||
const resetQuery = () => {
|
const resetQuery = () => {
|
||||||
// 清空搜索条件
|
// 清空搜索条件
|
||||||
queryRef.value?.resetFields()
|
queryRef.value?.resetFields()
|
||||||
// 清空多选
|
// 清空多选
|
||||||
selectObjs.value = []
|
selectObjs.value = []
|
||||||
getDataList()
|
getDataList()
|
||||||
}
|
}
|
||||||
|
|
||||||
// 导出excel
|
// 导出excel
|
||||||
const exportExcel = () => {
|
const exportExcel = () => {
|
||||||
downBlobFile('/supermarket/smErpCgPlan/export', Object.assign(state.queryForm, { ids: selectObjs }), 'smErpCgPlan.xlsx')
|
downBlobFile(
|
||||||
|
"/supermarket/smErpCgPlan/export",
|
||||||
|
Object.assign(state.queryForm, { ids: selectObjs }),
|
||||||
|
"smErpCgPlan.xlsx",
|
||||||
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
// 多选事件
|
// 多选事件
|
||||||
const selectionChangHandle = (objs: { id: string }[]) => {
|
const selectionChangHandle = (objs: { id: string }[]) => {
|
||||||
selectObjs.value = objs.map(({ id }) => id);
|
selectObjs.value = objs.map(({ id }) => id)
|
||||||
multiple.value = !objs.length;
|
multiple.value = !objs.length
|
||||||
};
|
}
|
||||||
|
|
||||||
// 删除操作
|
// 删除操作
|
||||||
const handleDelete = async (ids: string[]) => {
|
const handleDelete = async (ids: string[]) => {
|
||||||
try {
|
try {
|
||||||
await useMessageBox().confirm('此操作将永久删除');
|
await useMessageBox().confirm("此操作将永久删除")
|
||||||
} catch {
|
} catch {
|
||||||
return;
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
try {
|
try {
|
||||||
await delObjs(ids);
|
await delObjs(ids)
|
||||||
getDataList();
|
getDataList()
|
||||||
useMessage().success('删除成功');
|
useMessage().success("删除成功")
|
||||||
} catch (err: any) {
|
} catch (err: any) {
|
||||||
useMessage().error(err.msg);
|
useMessage().error(err.msg)
|
||||||
}
|
}
|
||||||
};
|
}
|
||||||
|
// ==========================================================
|
||||||
|
|
||||||
|
import { useRouter } from "vue-router"
|
||||||
|
|
||||||
|
const router = useRouter()
|
||||||
|
|
||||||
|
// 点击创建采购清单
|
||||||
|
const handleClickCreateCgPlan = () => {
|
||||||
|
router.push("/createCgPlan")
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
@@ -1,61 +1,54 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="layout-padding">
|
<div class="layout-padding">
|
||||||
<div class="layout-padding-auto layout-padding-view">
|
<div class="layout-padding-auto layout-padding-view">
|
||||||
<el-row>
|
<el-row>
|
||||||
<div class="mb8" style="width: 100%">
|
<div class="mb8" style="width: 100%">
|
||||||
<el-button icon="folder-add" type="primary" class="ml10" @click="formDialogRef.openDialog()"
|
<el-button
|
||||||
v-auth="'supermarket_smErpCgPlanItem_add'">
|
icon="folder-add"
|
||||||
新 增
|
type="primary"
|
||||||
</el-button>
|
class="ml10"
|
||||||
<el-button plain :disabled="multiple" icon="Delete" type="primary"
|
@click="formDialogRef.openDialog()"
|
||||||
v-auth="'supermarket_smErpCgPlanItem_del'" @click="handleDelete(selectObjs)">
|
v-auth="'supermarket_smErpCgPlanItem_add'"
|
||||||
删除
|
>
|
||||||
</el-button>
|
新 增
|
||||||
<right-toolbar v-model:showSearch="showSearch" :export="'supermarket_smErpCgPlanItem_export'"
|
</el-button>
|
||||||
@exportExcel="exportExcel" class="ml10 mr20" style="float: right;"
|
<el-button
|
||||||
@queryTable="getDataList"></right-toolbar>
|
plain
|
||||||
</div>
|
:disabled="multiple"
|
||||||
</el-row>
|
icon="Delete"
|
||||||
<el-table :data="state.dataList" v-loading="state.loading" border
|
type="primary"
|
||||||
:cell-style="tableStyle.cellStyle" :header-cell-style="tableStyle.headerCellStyle"
|
v-auth="'supermarket_smErpCgPlanItem_del'"
|
||||||
@selection-change="selectionChangHandle"
|
@click="handleDelete(selectObjs)"
|
||||||
@sort-change="sortChangeHandle">
|
>
|
||||||
<el-table-column type="selection" width="40" align="center" />
|
删除
|
||||||
<el-table-column type="index" label="#" width="40" />
|
</el-button>
|
||||||
<el-table-column prop="planId" label="采购id" show-overflow-tooltip/>
|
<right-toolbar
|
||||||
<el-table-column prop="erpSpuId" label="库存商品id" show-overflow-tooltip/>
|
v-model:showSearch="showSearch"
|
||||||
<el-table-column prop="merchantId" label="商户编号" show-overflow-tooltip/>
|
:export="'supermarket_smErpCgPlanItem_export'"
|
||||||
<el-table-column prop="deptId" label="部门id" show-overflow-tooltip/>
|
@exportExcel="exportExcel"
|
||||||
<el-table-column prop="quantity" label="数量" show-overflow-tooltip/>
|
class="ml10 mr20"
|
||||||
<el-table-column prop="unitPrice" label="进价" show-overflow-tooltip/>
|
style="float: right"
|
||||||
<el-table-column prop="totalAmount" label="累计总金额" show-overflow-tooltip/>
|
@queryTable="getDataList"
|
||||||
<el-table-column prop="remark" label="备注" show-overflow-tooltip/>
|
></right-toolbar>
|
||||||
<el-table-column prop="unitId" label="包装单位id" show-overflow-tooltip/>
|
</div>
|
||||||
<el-table-column label="操作" width="150">
|
</el-row>
|
||||||
<template #default="scope">
|
|
||||||
<el-button icon="edit-pen" text type="primary" v-auth="'supermarket_smErpCgPlanItem_edit'"
|
|
||||||
@click="formDialogRef.openDialog(scope.row.id)">编辑</el-button>
|
|
||||||
<el-button icon="delete" text type="primary" v-auth="'supermarket_smErpCgPlanItem_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>
|
|
||||||
|
|
||||||
<!-- 编辑、新增 -->
|
<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
|
||||||
<form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
|
</div>
|
||||||
|
|
||||||
</div>
|
<!-- 编辑、新增 -->
|
||||||
|
<form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
|
||||||
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts" name="systemSmErpCgPlanItem">
|
<script setup lang="ts" name="systemSmErpCgPlanItem">
|
||||||
import { BasicTableProps, useTable } from "/@/hooks/table";
|
import { BasicTableProps, useTable } from "/@/hooks/table"
|
||||||
import { fetchList, delObjs } from "/@/api/supermarket/smErpCgPlanItem";
|
import { fetchList, delObjs } from "/@/api/supermarket/smErpCgPlanItem"
|
||||||
import { useMessage, useMessageBox } from "/@/hooks/message";
|
import { useMessage, useMessageBox } from "/@/hooks/message"
|
||||||
import { useDict } from '/@/hooks/dict';
|
import { useDict } from "/@/hooks/dict"
|
||||||
|
|
||||||
// 引入组件
|
// 引入组件
|
||||||
const FormDialog = defineAsyncComponent(() => import('./form.vue'));
|
const FormDialog = defineAsyncComponent(() => import("./form.vue"))
|
||||||
// 定义查询字典
|
// 定义查询字典
|
||||||
|
|
||||||
// 定义变量内容
|
// 定义变量内容
|
||||||
@@ -64,58 +57,48 @@ const formDialogRef = ref()
|
|||||||
const queryRef = ref()
|
const queryRef = ref()
|
||||||
const showSearch = ref(true)
|
const showSearch = ref(true)
|
||||||
// 多选变量
|
// 多选变量
|
||||||
const selectObjs = ref([]) as any
|
|
||||||
const multiple = ref(true)
|
|
||||||
|
|
||||||
const state: BasicTableProps = reactive<BasicTableProps>({
|
const state: BasicTableProps = reactive<BasicTableProps>({
|
||||||
queryForm: {},
|
queryForm: {},
|
||||||
pageList: fetchList
|
pageList: fetchList,
|
||||||
})
|
})
|
||||||
|
|
||||||
// table hook
|
// table hook
|
||||||
const {
|
const { getDataList, currentChangeHandle, sizeChangeHandle, sortChangeHandle, downBlobFile, tableStyle } =
|
||||||
getDataList,
|
useTable(state)
|
||||||
currentChangeHandle,
|
|
||||||
sizeChangeHandle,
|
|
||||||
sortChangeHandle,
|
|
||||||
downBlobFile,
|
|
||||||
tableStyle
|
|
||||||
} = useTable(state)
|
|
||||||
|
|
||||||
// 清空搜索条件
|
// 清空搜索条件
|
||||||
const resetQuery = () => {
|
const resetQuery = () => {
|
||||||
// 清空搜索条件
|
// 清空搜索条件
|
||||||
queryRef.value?.resetFields()
|
queryRef.value?.resetFields()
|
||||||
// 清空多选
|
// 清空多选
|
||||||
selectObjs.value = []
|
selectObjs.value = []
|
||||||
getDataList()
|
getDataList()
|
||||||
}
|
}
|
||||||
|
|
||||||
// 导出excel
|
// 导出excel
|
||||||
const exportExcel = () => {
|
const exportExcel = () => {
|
||||||
downBlobFile('/supermarket/smErpCgPlanItem/export', Object.assign(state.queryForm, { ids: selectObjs }), 'smErpCgPlanItem.xlsx')
|
downBlobFile(
|
||||||
|
"/supermarket/smErpCgPlanItem/export",
|
||||||
|
Object.assign(state.queryForm, { ids: selectObjs }),
|
||||||
|
"smErpCgPlanItem.xlsx",
|
||||||
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
// 多选事件
|
|
||||||
const selectionChangHandle = (objs: { id: string }[]) => {
|
|
||||||
selectObjs.value = objs.map(({ id }) => id);
|
|
||||||
multiple.value = !objs.length;
|
|
||||||
};
|
|
||||||
|
|
||||||
// 删除操作
|
// 删除操作
|
||||||
const handleDelete = async (ids: string[]) => {
|
const handleDelete = async (ids: string[]) => {
|
||||||
try {
|
try {
|
||||||
await useMessageBox().confirm('此操作将永久删除');
|
await useMessageBox().confirm("此操作将永久删除")
|
||||||
} catch {
|
} catch {
|
||||||
return;
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
try {
|
try {
|
||||||
await delObjs(ids);
|
await delObjs(ids)
|
||||||
getDataList();
|
getDataList()
|
||||||
useMessage().success('删除成功');
|
useMessage().success("删除成功")
|
||||||
} catch (err: any) {
|
} catch (err: any) {
|
||||||
useMessage().error(err.msg);
|
useMessage().error(err.msg)
|
||||||
}
|
}
|
||||||
};
|
}
|
||||||
</script>
|
</script>
|
||||||
Reference in new issue
Block a user