zianxin/pj_admin_cloud
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'master' of http://gitea.zianxin.com/zianxin/biz-pc-cloud

Browse Source
This commit is contained in:
dzc committed 2025-02-18 14:05:01 +08:00
2 parents 4b3b88d20e e0c58a500b
commit 66d6fe3a92
9 files changed
+700 -381
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

.env.development
+4 -4
View File
@@ -8,18 +8,18 @@ VITE_OPEN = true
ENV = 'development'
# ADMIN 服务地址
# VITE_ADMIN_PROXY_PATH = http://123.156.230.15:8089/api/ # 线上
VITE_ADMIN_PROXY_PATH = http://123.156.230.15:8089/api/ # 线上
# VITE_ADMIN_PROXY_PATH = http://pjcloud.center.takin.cc/
# VITE_ADMIN_PROXY_PATH = http://localhost:9999/
VITE_ADMIN_PROXY_PATH = http://192.168.101.50:9999/ # 邓-本地
# VITE_ADMIN_PROXY_PATH = http://192.168.101.50:9999/ # 邓-本地
# VITE_ADMIN_PROXY_PATH = http://59.202.170.152:81/api # 正式环境
# 图片访问基础地址
# VITE_IMAGE_BASE_PATH = http://123.156.230.15:8089/api # 线上
VITE_IMAGE_BASE_PATH = http://123.156.230.15:8089/api # 线上
# VITE_IMAGE_BASE_PATH = http://pjcloud.center.takin.cc
# VITE_IMAGE_BASE_PATH = http://localhost:9999
VITE_IMAGE_BASE_PATH = http://192.168.101.50:9999 # 邓-本地
# VITE_IMAGE_BASE_PATH = http://192.168.101.50:9999 # 邓-本地
# VITE_IMAGE_BASE_PATH = http://59.202.170.152:81/api/ # 正式环境
# 代码生成服务地址
src/api/supermarket/smErpCgDd.ts
+41
View File
@@ -0,0 +1,41 @@
import request from "/@/utils/request"
export function fetchList(query?: Object) {
return request({
url: '/supermarket/smErpCgDd/page',
method: 'get',
params: query
})
}
export function addObj(obj?: Object) {
return request({
url: '/supermarket/smErpCgDd',
method: 'post',
data: obj
})
}
export function getObj(id?: string) {
return request({
url: '/supermarket/smErpCgDd/' + id,
method: 'get'
})
}
export function delObjs(ids?: Object) {
return request({
url: '/supermarket/smErpCgDd',
method: 'delete',
data: ids
})
}
export function putObj(obj?: Object) {
return request({
url: '/supermarket/smErpCgDd',
method: 'put',
data: obj
})
}
src/components/DepTree/index.vue
-210
View File
@@ -1,210 +0,0 @@
<template>
<div class="container">
<!-- 头部区域 -->
<div class="container-header">
<div class="container-header-input">
<el-input v-model="searchName" suffix-icon="search" :placeholder="placeholder" clearable @change="getTreeData" />
</div>
<div class="container-header-dropdown" v-if="showExpand">
<el-dropdown :hide-on-click="false">
<el-icon style="transform: rotate(90deg)">
<MoreFilled />
</el-icon>
<template #dropdown>
<el-dropdown-menu>
<el-dropdown-item>
<el-button
class="!h-[20px] !text-gray-500 dark:!text-white dark:hover:!text-primary"
link
:icon="isExpand ? 'expand' : 'fold'"
@click="toggleRowExpansionAll(isExpand ? false : true)"
>
{{ isExpand ? "折叠" : "展开" }}
</el-button>
</el-dropdown-item>
</el-dropdown-menu>
</template>
</el-dropdown>
</div>
</div>
<!-- 树形结构 -->
<div class="container-tree">
<el-tree
ref="depTreeRef"
:props="props.props"
:data="state.treeList"
:expand-on-click-node="false"
:loading="state.loading"
node-key="id"
highlight-current
default-expand-all
@node-click="handleNodeClick"
show-checkbox
@check-change="handleCheckChange"
>
<template #default="{ node, data }" v-if="$slots.default">
<slot :node="node" :data="data" />
</template>
</el-tree>
</div>
<!-- 底部区域 -->
<div class="container-switch">
<el-switch
v-model="state.isDeep"
@change="handleTreeDeepSearch"
:inactive-text="switchInactiveText"
:active-text="switchActiveText"
:disabled="checkedTreeNodes.length > 0"
/>
</div>
</div>
</template>
<script setup lang="ts" name="dep-tree">
import { useMessage } from "/@/hooks/message"
const props = withDefaults(
defineProps<{
placeholder?: string // 输入框占位符
loading?: boolean // 加载中的状态
showExpand?: boolean // 折叠控制
query?: (searchName?: string) => Promise<any> // 查询函数
props?: object
switchInactiveText?: string | undefined
switchActiveText?: string | undefined
}>(),
{
placeholder: "",
loading: false,
showExpand: true,
query: () => new Promise((resolve) => resolve([])),
props: () => {
return {
label: "name",
children: "children",
value: "id",
}
},
switchInactiveText: "当前级",
switchActiveText: "当前级及子级",
},
)
const emit = defineEmits(["nodeClick", "treeDeepSearch"])
const state = reactive({
treeList: [],
loading: props.loading,
isDeep: false,
})
const depTreeRef = ref() // 树组件的引用
const searchName = ref() // 查询关键字
const isExpand = ref(true) // 是否展开所有节点
// 被勾选的树节点
const checkedTreeNodes = ref([])
// 获取部门树形结构数据
const getTreeData = () => {
if (props.query instanceof Function) {
state.loading = true
// 调用传入的查询函数，并将查询关键字作为参数传入
const result = props.query(unref(searchName))
// 如果查询结果为 Promise 类型，则进行后续处理
if ((typeof result === "object" || typeof result === "function") && typeof result.then === "function") {
result
.then((r: any) => {
state.treeList = r.data
})
.catch((err) => {
useMessage().error(err.msg)
})
.finally(() => (state.loading = false))
}
}
}
// 点击树形结构节点
const handleNodeClick = (item: any) => emit("nodeClick", item)
// 节点深度搜索
const handleTreeDeepSearch = () => emit("treeDeepSearch", state.isDeep)
// 切换所有节点的展开/收起状态。status：true 为展开，false 为收起
const toggleRowExpansionAll = (status: boolean) => {
isExpand.value = status
const nodes = depTreeRef.value.store._getAllNodes()
for (let i = 0; i < nodes.length; i++) {
nodes[i].expanded = status
}
}
watch(checkedTreeNodes, (val) => {
if (checkedTreeNodes.value.length > 0) {
state.isDeep = false
}
})
// 勾选树节点时
const handleCheckChange = (data: any, checked: boolean, indeterminate: boolean) => {
checkedTreeNodes.value = depTreeRef.value.getCheckedNodes()
// console.log(data, checked, indeterminate)
}
onMounted(() => {
getTreeData()
})
defineExpose({
getTreeData,
})
</script>
<style lang="scss" scoped>
.container {
height: 100%;
display: flex;
flex-direction: column;
&-header {
display: flex;
align-items: center;
padding-bottom: 10px;
box-shadow: 0 8px 8px -8px rgba(0, 0, 0, 0.1);
z-index: 10;
&-input {
width: 90%;
}
&-dropdown {
flex: 1;
margin-left: 5%;
line-height: 100%;
}
}
&-tree {
flex: 1;
overflow: hidden;
&:hover {
overflow: auto;
}
}
&-switch {
display: flex;
justify-content: center;
align-items: center;
padding-top: 10px;
box-shadow: 0 -8px 8px -8px rgba(0, 0, 0, 0.1);
z-index: 999;
position: sticky;
bottom: 0;
overflow: hidden;
}
}
</style>
src/components/DraggableDepTree/index.vue
+229
View File
@@ -0,0 +1,229 @@
<template>
<Splitpanes @resize="state.treeWidth = $event[0].size">
<pane :size="state.treeWidth">
<!-- 树 -->
<div class="h-full flex flex-col m-1">
<!-- 头部区域 -->
<div class="flex items-center pb-2 shadow-gray-400 z-10" style="box-shadow: 0 8px 8px -8px rgba(0, 0, 0, 0.1)">
<div class="w-4/5">
<el-input v-model="state.searchName" suffix-icon="search" :placeholder="placeholder" clearable @change="getTreeData" />
</div>
<div class="flex-1 ml-[5%] leading-[100%]" v-if="showExpand">
<el-dropdown :hide-on-click="false">
<el-icon style="transform: rotate(90deg)">
<MoreFilled />
</el-icon>
<template #dropdown>
<el-dropdown-menu>
<el-dropdown-item>
<el-button
class="!h-[20px] !text-gray-500 dark:!text-white dark:hover:!text-primary"
link
:icon="state.isExpand ? 'expand' : 'fold'"
@click="toggleRowExpansionAll(state.isExpand ? false : true)"
>
{{ state.isExpand ? "折叠" : "展开" }}
</el-button>
</el-dropdown-item>
</el-dropdown-menu>
</template>
</el-dropdown>
</div>
</div>
<!-- 树形结构 -->
<div class="flex-1 overflow-hidden hover:overflow-auto">
<el-tree
ref="treeRef"
:props="props.props"
:data="state.treeDataList"
:expand-on-click-node="false"
:loading="state.loading"
node-key="id"
highlight-current
default-expand-all
@node-click="handleNodeClick"
show-checkbox
@check-change="handleCheckChange"
/>
</div>
<!-- 底部区域 -->
<div
class="flex justify-center items-center pt-2 z-50 sticky bottom-0 overflow-hidden"
style="box-shadow: 0 -8px 8px -8px rgba(0, 0, 0, 0.1)"
>
<el-switch
v-model="state.switch"
@change="handleSwitchChange"
:inactive-text="switchInactiveText"
:active-text="switchActiveText"
:disabled="state.checkedTreeNodes.length > 0"
/>
</div>
</div>
</pane>
<pane :size="100 - state.treeWidth" class="pl-4 relative">
<!-- 折叠按钮 -->
<div
class="w-[12px] h-[56px] bg-gray-200 absolute left-0 top-[44vh] translate-y-[-50%] transition-all cursor-pointer rounded-tr-2xl rounded-br-2xl"
@click="handleClickTreeFold()"
>
<i class="text-gray-400 inline-block text-center leading-[62px] hover:opacity-50">
<el-icon>
<ArrowLeftBold v-if="state.treeWidth > 0" />
<ArrowRightBold v-else />
</el-icon>
</i>
</div>
<div class="w-full h-full overflow-auto">
<slot name="default" />
</div>
</pane>
</Splitpanes>
</template>
<script setup lang="ts" name="DraggableDepTree">
import { computed } from "vue"
import { useMessage } from "/@/hooks/message"
const props = withDefaults(
defineProps<{
placeholder?: string // 输入框占位符
loading?: boolean // 加载中的状态
showExpand?: boolean // 折叠控制
query?: (searchName?: string) => Promise<any> // 查询函数
props?: object
switchInactiveText?: string | undefined
switchActiveText?: string | undefined
defaultTreeWidth?: number | string
}>(),
{
placeholder: "",
loading: false,
showExpand: true,
query: () => new Promise((resolve) => resolve([])),
props: () => {
return {
label: "name",
children: "children",
value: "id",
}
},
switchInactiveText: "当前级",
switchActiveText: "当前级及子级",
defaultTreeWidth: 20,
},
)
const emit = defineEmits(["nodeClick", "treeNodeCheckChange", "treeDeepSearch"])
const treeRef = ref() // 树组件ref
const state = reactive({
searchName: "", // 查询关键字
isExpand: true, // 是否展开树所有节点
treeWidth: Number(props.defaultTreeWidth), // 树组件宽度
treeWidthMemo: Number(props.defaultTreeWidth), // 树组件宽度记录
treeDataList: [],
checkedTreeNodes: [], // 被勾选的树节点
loading: props.loading,
switch: false, // switch开关
})
// 是否折叠树组件
const treeVisible = computed(() => state.treeWidth > 0)
// 获取部门树形结构数据
const getTreeData = () => {
if (props.query instanceof Function) {
state.loading = true
const result = props.query(state.searchName)
// 如果查询结果为 Promise 类型，则进行后续处理
if ((typeof result === "object" || typeof result === "function") && typeof result.then === "function") {
result
.then((r: any) => {
state.treeDataList = r.data
})
.catch((err) => {
useMessage().error(err.msg)
})
.finally(() => (state.loading = false))
}
}
}
// 点击折叠树组件
const handleClickTreeFold = () => {
if (treeVisible.value) {
state.treeWidthMemo = state.treeWidth
state.treeWidth = 0
} else {
state.treeWidth = state.treeWidthMemo
}
}
// 点击树形结构节点
const handleNodeClick = (nodeData: any) => emit("nodeClick", nodeData)
// 节点深度搜索
const handleSwitchChange = () => emit("treeDeepSearch", state.switch)
// 勾选树节点时
const handleCheckChange = (data: any, checked: boolean, indeterminate: boolean) => {
const checkedNodes = treeRef.value.getCheckedNodes()
state.checkedTreeNodes = checkedNodes
emit("treeNodeCheckChange", checkedNodes)
}
// 切换所有节点的展开/收起状态。status：true 为展开，false 为收起
const toggleRowExpansionAll = (status: boolean) => {
state.isExpand = status
const nodes = treeRef.value.store._getAllNodes()
for (let i = 0; i < nodes.length; i++) {
nodes[i].expanded = status
}
}
// 勾选树节点时关闭switch
watch(
() => state.checkedTreeNodes,
(val) => {
if (state.checkedTreeNodes.length > 0) {
state.switch = false
}
},
)
// 重置数据
const resetData = () => {
state.searchName = ""
state.checkedTreeNodes = []
state.switch = false
getTreeData()
}
onMounted(() => {
getTreeData()
})
defineExpose({
getTreeData,
resetData,
})
</script>
<style lang="scss">
.splitpanes--vertical > .splitpanes__splitter {
background: var(--el-color-primary);
/* min-width: 2px; */
width: 2px;
transition: all 0.3s ease;
}
.splitpanes--vertical > .splitpanes__splitter:active {
background: var(--el-color-primary);
opacity: 0.6;
}
.splitpanes--vertical > .splitpanes__splitter:hover {
background: var(--el-color-primary);
opacity: 0.6;
}
</style>
src/components/index.ts
+2 -2
View File
@@ -12,7 +12,7 @@ import Tip from "/@/components/Tip/index.vue"
import TagList from "/@/components/TagList/index.vue"
import SvgIcon from "/@/components/SvgIcon/index.vue"
import PreviewImage from "/@/components/PreviewImage/index.vue"
import DepTree from "/@/components/DepTree/index.vue"
import DraggableDepTree from "/@/components/DraggableDepTree/index.vue"
// 业务组件
import SelectUser from "/@/components/Select/SelectUser.vue"
@@ -57,7 +57,7 @@ export default {
app.component("TagList", TagList)
app.component("SvgIcon", SvgIcon)
app.component("PreviewImage", PreviewImage)
app.component("DepTree", DepTree)
app.component("DraggableDepTree", DraggableDepTree)
app.component("SelectUser", SelectUser)
app.component("SelectWalletType", SelectWalletType)
src/views/admin/system/user/index.vue
+34 -105
View File
@@ -1,46 +1,19 @@
<template>
<div class="layout-padding">
<Splitpanes @resize="depTreeWidth = $event[0].size">
<pane :size="depTreeWidth">
<dep-tree
class="p-2"
ref="depTreeRef"
:placeholder="$t('common.queryDeptTip')"
:query="deptData.queryList"
:show-expand="true"
@node-click="handleNodeClick"
@treeDeepSearch="treeDeepSearch"
switch-inactive-text="当前部门"
switch-active-text="当前部门及子部门"
>
<!-- 没有数据权限提示 -->
<template #default="{ node, data }">
<el-tooltip v-if="data.isLock" class="item" effect="dark" :content="$t('sysuser.noDataScopeTip')" placement="right-start">
<span>
{{ node.label }}
<SvgIcon name="ele-Lock" />
</span>
</el-tooltip>
<span v-if="!data.isLock">{{ node.label }}</span>
</template>
</dep-tree>
</pane>
<pane :size="100 - depTreeWidth" class="pl8 relative">
<div
class="w-[12px] h-[56px] absolute left-0 top-[44vh] translate-y-[-50%] transition-all cursor-pointer"
@click="handleClickDepTreeDrawer(isOpen)"
style="background-color: #e3e9ed; border-top-right-radius: 10px; border-bottom-right-radius: 10px"
>
<i class="drawer-icon">
<el-icon>
<ArrowLeftBold v-if="depTreeWidth > 0.5" />
<ArrowRightBold v-else />
</el-icon>
</i>
</div>
<div class="layout-padding-auto layout-padding-view">
<div class="layout-padding-auto layout-padding-view">
<DraggableDepTree
ref="draggableDepTreeRef"
placeholder="请输入部门名称"
:query="deptData.queryList"
:show-expand="true"
@node-click="handleNodeClick"
@treeNodeCheckChange="treeNodeCheckChange"
@treeDeepSearch="treeDeepSearch"
switch-inactive-text="当前部门"
switch-active-text="当前部门及子部门"
:defaultTreeWidth="20"
>
<template #default>
<el-row v-show="showSearch">
<el-form ref="queryRef" :inline="true" :model="state.queryForm" @keyup.enter="getDataList">
<el-form-item label="用户" prop="userIds">
@@ -60,7 +33,6 @@
</el-form-item>
</el-form>
</el-row>
<el-row>
<div class="mb8" style="width: 100%">
<el-button v-auth="'sys_user_add'" icon="folder-add" type="primary" @click="userDialogRef.openDialog()">
@@ -147,7 +119,7 @@
<el-table-column
v-auths="['sys_user_edit', 'userFace_sysUserFace_view', 'sys_user_del']"
:label="$t('common.action')"
width="300"
width="200"
fixed="right"
>
<template #default="scope">
@@ -198,11 +170,10 @@
</template>
</el-table-column>
</el-table>
<pagination v-bind="state.pagination" @current-change="currentChangeHandle" @size-change="sizeChangeHandle"> </pagination>
</div>
</pane>
</Splitpanes>
</template>
</DraggableDepTree>
</div>
<user-form ref="userDialogRef" @refresh="getDataList(false)" :deptId="state.queryForm.deptId" />
<face-manage ref="faceManageRef" @refresh="getDataList(false)" />
@@ -225,22 +196,19 @@ import { useMessage, useMessageBox } from "/@/hooks/message"
import { useI18n } from "vue-i18n"
import { auth } from "/@/utils/authFunction"
// 动态引入组件
const UserForm = defineAsyncComponent(() => import("./form.vue"))
const FaceManage = defineAsyncComponent(() => import("./face-manage.vue"))
const PopoverInput = defineAsyncComponent(() => import("/@/components/PopoverInput/index.vue"))
const { t } = useI18n()
// 定义变量内容
const userDialogRef = ref()
const faceManageRef = ref()
const excelUploadRef = ref()
const queryRef = ref()
const showSearch = ref(true)
const inputPassword = ref()
const depTreeRef = ref() // 树组件ref引用
const depTreeWidth = ref<number>(20) // 部门树组件宽度
const draggableDepTreeRef = ref() // 树组件ref引用
// 多选rows
const selectObjs = ref([]) as any
@@ -268,22 +236,29 @@ const deptData = reactive({
},
})
const treeDeepSearch = (isDeep: boolean) => {
state.queryForm.isDeepDept = isDeep
getDataList()
}
// 清空搜索条件
const resetQuery = () => {
queryRef.value?.resetFields()
state.queryForm.deptId = ""
depTreeRef.value.getTreeData()
draggableDepTreeRef.value.resetData()
getDataList()
}
// 点击树
const handleNodeClick = (e: any) => {
state.queryForm.deptId = e.id
const handleNodeClick = (clickedNode: any) => {
state.queryForm.deptId = clickedNode.id
getDataList()
}
// 树节点勾选改变
const treeNodeCheckChange = (checkedNodes: any) => {
state.queryForm.deptId = checkedNodes.map((item: any) => item.id)
getDataList()
}
// 是否深度搜索
const treeDeepSearch = (isDeep: boolean) => {
state.queryForm.isDeepDept = isDeep
getDataList()
}
@@ -351,50 +326,4 @@ const changePassword = async (row: any) => {
useMessage().success(t("common.optSuccessText"))
getDataList()
}
const isOpen = ref(true)
const temp = ref()
const handleClickDepTreeDrawer = (isDrawerOpen: boolean) => {
if (isDrawerOpen) {
temp.value = depTreeWidth.value
depTreeWidth.value = 0.5
} else {
depTreeWidth.value = temp.value
}
isOpen.value = !isOpen.value
}
</script>
<style>
.splitpanes--vertical > .splitpanes__splitter {
background: var(--el-color-primary);
/* min-width: 2px; */
width: 2px;
transition: all 0.3s ease;
}
.splitpanes--vertical > .splitpanes__splitter:active {
background: var(--el-color-primary);
opacity: 0.6;
}
.splitpanes--vertical > .splitpanes__splitter:hover {
background: var(--el-color-primary);
opacity: 0.6;
}
.drawer-icon {
color: #b7bdc8;
font-size: 1rem;
display: inline-block;
text-align: center;
line-height: 64px;
}
.drawer-icon:hover {
opacity: 0.5;
}
/* .drawer-icon::before {
content: "<";
background: none;
box-sizing: inherit;
color: #b7bdc8;
font-size: 1em;
} */
</style>
src/views/supermarket/smErpCgDd/form.vue
+200
View File
@@ -0,0 +1,200 @@
<template>
<el-dialog :title="form.id ? '编辑' : '新增'" v-model="visible"
:close-on-click-modal="false" draggable>
<el-form ref="dataFormRef" :model="form" :rules="dataRules" formDialogRef label-width="90px" v-loading="loading">
<el-row :gutter="24">
<el-col :span="12" class="mb20">
<el-form-item label="编号" prop="code">
<el-input v-model="form.code" placeholder="请输入编号"/>
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-form-item label="单据日期" prop="dDate">
<el-date-picker type="date" placeholder="请选择单据日期" v-model="form.dDate" :value-format="dateStr"></el-date-picker>
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-form-item label="仓库id" prop="warehouseId">
<el-input v-model="form.warehouseId" placeholder="请输入仓库id"/>
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-form-item label="经办人id" prop="handlerUserId">
<el-select v-model="form.handlerUserId" placeholder="请选择经办人id">
<el-option label="请选择">0</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-form-item label="审批状态" prop="checkStatus">
<el-input v-model="form.checkStatus" placeholder="请输入审批状态"/>
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-form-item label="审批人id" prop="checkUserId">
<el-select v-model="form.checkUserId" placeholder="请选择审批人id">
<el-option label="请选择">0</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-form-item label="审核日期" prop="checkTime">
<el-input v-model="form.checkTime" placeholder="请输入审核日期"/>
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-form-item label="商户编号" prop="merchantId">
<el-input v-model="form.merchantId" placeholder="请输入商户编号"/>
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-form-item label="部门id" prop="deptId">
<el-input v-model="form.deptId" placeholder="请输入部门id"/>
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-form-item label="出入库数量" prop="quantity">
<el-input v-model="form.quantity" placeholder="请输入出入库数量"/>
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-form-item label="累计进货数量" prop="totalNumber">
<el-input v-model="form.totalNumber" placeholder="请输入累计进货数量"/>
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-form-item label="累计总金额" prop="totalAmount">
<el-input v-model="form.totalAmount" placeholder="请输入累计总金额"/>
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-form-item label="货商" prop="supplierId">
<el-input v-model="form.supplierId" placeholder="请输入货商"/>
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-form-item label="备注" prop="remark">
<el-input v-model="form.remark" 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-form>
<template #footer>
<span class="dialog-footer">
<el-button @click="visible = false">取消</el-button>
<el-button type="primary" @click="onSubmit" :disabled="loading">确认</el-button>
</span>
</template>
</el-dialog>
</template>
<script setup lang="ts" name="SmErpCgDdDialog">
import { useDict } from '/@/hooks/dict';
import { useMessage } from "/@/hooks/message";
import { getObj, addObj, putObj } from '/@/api/supermarket/smErpCgDd'
import { rule } from '/@/utils/validate';
const emit = defineEmits(['refresh']);
// 定义变量内容
const dataFormRef = ref();
const visible = ref(false)
const loading = ref(false)
// 定义字典
const { check_status } = useDict('check_status')
// 提交表单数据
const form = reactive({
id:'',
code: '',
dDate: '',
warehouseId: '',
handlerUserId: '',
checkStatus: '',
checkUserId: '',
checkTime: '',
merchantId: '',
deptId: '',
quantity: '',
totalNumber: '',
totalAmount: '',
supplierId: '',
remark: '',
orderNumber: '',
});
// 定义校验规则
const dataRules = ref({
})
// 打开弹窗
const openDialog = (id: string) => {
visible.value = true
form.id = ''
// 重置表单数据
nextTick(() => {
dataFormRef.value?.resetFields();
});
// 获取smErpCgDd信息
if (id) {
form.id = id
getsmErpCgDdData(id)
}
};
// 提交
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 ? '修改成功' : '添加成功');
visible.value = false;
emit('refresh');
} catch (err: any) {
useMessage().error(err.msg);
} finally {
loading.value = false;
}
};
// 初始化表单数据
const getsmErpCgDdData = (id: string) => {
// 获取数据
loading.value = true
getObj(id).then((res: any) => {
Object.assign(form, res.data)
}).finally(() => {
loading.value = false
})
};
// 暴露变量
defineExpose({
openDialog
});
</script>
src/views/supermarket/smErpCgDd/index.vue
+132
View File
@@ -0,0 +1,132 @@
<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="formDialogRef.openDialog()"
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"></right-toolbar>
</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="dDate" label="单据日期" show-overflow-tooltip/>
<el-table-column prop="warehouseId" label="仓库id" show-overflow-tooltip/>
<el-table-column prop="handlerUserId" label="经办人id" 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="checkUserId" label="审批人id" show-overflow-tooltip/>
<el-table-column prop="checkTime" label="审核日期" show-overflow-tooltip/>
<el-table-column prop="merchantId" label="商户编号" show-overflow-tooltip/>
<el-table-column prop="deptId" label="部门id" show-overflow-tooltip/>
<el-table-column prop="quantity" label="出入库数量" show-overflow-tooltip/>
<el-table-column prop="totalNumber" label="累计进货数量" show-overflow-tooltip/>
<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 prop="orderNumber" 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="formDialogRef.openDialog(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>
<!-- 编辑、新增 -->
<form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
</div>
</template>
<script setup lang="ts" name="systemSmErpCgDd">
import { BasicTableProps, useTable } from "/@/hooks/table";
import { fetchList, delObjs } from "/@/api/supermarket/smErpCgDd";
import { useMessage, useMessageBox } from "/@/hooks/message";
import { useDict } from '/@/hooks/dict';
// 引入组件
const FormDialog = defineAsyncComponent(() => import('./form.vue'));
// 定义查询字典
const { check_status } = useDict('check_status')
// 定义变量内容
const formDialogRef = ref()
// 搜索变量
const queryRef = ref()
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 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>
src/views/supermarketerp/smErpCgPlan/cgPlanOption.vue
+58 -60
View File
@@ -101,7 +101,12 @@
</template>
</vxe-column> -->
<vxe-column field="productName" title="库存商品" />
<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 }">
@@ -166,7 +171,7 @@
<el-tooltip effect="dark" content="返回列表页面" placement="top">
<el-button type="primary" plain @click="router.back()">取消</el-button>
</el-tooltip>
<el-tooltip effect="dark" content="保存并清空数据" placement="top">
<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">
@@ -251,14 +256,14 @@ import { ref, reactive, computed, onMounted } from "vue"
import { useRouter, useRoute } from "vue-router"
import { useDict } from "/@/hooks/dict"
import { useMessage } from "/@/hooks/message"
import { getObj, addObj, putObj, getPlanCode, getCgPlanSpuPage } from "/@/api/supermarketerp/smErpCgPlan"
import { getObj, addObj, putObj, getPlanCode, getCgPlanSpuPage, getErpSpuSimpleAll } from "/@/api/supermarketerp/smErpCgPlan"
import { VxeTableEvents, VxeTablePropTypes, type VxeTableInstance } from "vxe-table"
import { getSupplierTypeOptions } from "/@/api/supermarketerp/smErpSupplier"
import { storePrice } from "/@/utils/formatMoney"
// 基本表单数据类型
interface FormVO {
id?: string
id: string | undefined
planCode: string
orderNumber: string
planDate: string
@@ -300,15 +305,19 @@ const baseDataForm = reactive<FormVO>({
})
const state = reactive<{
editableTableData: RowVO[]
erpSpuItemsMemo: RowVO[]
selectedRowsErpSpuIds: string[]
insertedRowNumber: number
erpSpuSimpleAll: any
spuSelectDialogVisible: boolean
spuDataList: any[]
selectedSpuObjs: any[]
}>({
editableTableData: [], // 可编辑表格数据
erpSpuItemsMemo: [], // 请求到的可编辑表格商品数据的缓存
selectedRowsErpSpuIds: [], // 可编辑表格已选行的ErpSpuId
insertedRowNumber: 0, // 可编辑表格插入行的行号
erpSpuSimpleAll: [], // 简要商品列表
spuSelectDialogVisible: false, // 商品选择对话框开关
spuDataList: [], // 商品列表
@@ -333,31 +342,26 @@ const getInitData = async () => {
baseDataForm.id = undefined
const id = route.query.id as string
if (id) {
// 获取数据
loading.value = true
getObj(id)
.then((res: any) => {
Object.assign(baseDataForm, {
id: res.data.id,
planCode: res.data.planCode,
orderNumber: res.data.orderNumber,
planDate: res.data.planDate,
supplierId: res.data.supplierId,
handlerUserId: res.data.handlerUserId,
remark: res.data.remark,
})
state.editableTableData = res.data.items
})
.finally(() => {
loading.value = false
})
// 获取采购计划数据 & 获取简要商品列表
const [cgPlanData, erpSpuSimpleAll] = await Promise.allSettled([getObj(id), getErpSpuSimpleAll()])
.then((results) => results.map((result) => (result.status === "fulfilled" ? result.value : null)))
.finally(() => (loading.value = false))
// 获取货商选项 & 获取简要商品列表
// const [supplierTypeOptions, planCode] = await Promise.allSettled([getSupplierTypeOptions(), getPlanCode()]).then((results) =>
// results.map((result) => (result.status === "fulfilled" ? result.value : null)),
// )
// supplierTypeOptions && supplierTypeOptions.code === 0 && (supplierTypeDict.value = supplierTypeOptions.data)
// planCode && planCode.code === 0 && (baseDataForm.planCode = planCode.data)
if (cgPlanData && cgPlanData.code === 0) {
Object.assign(baseDataForm, {
id: cgPlanData.data.id,
planCode: cgPlanData.data.planCode,
orderNumber: cgPlanData.data.orderNumber,
planDate: cgPlanData.data.planDate,
supplierId: cgPlanData.data.supplierId,
handlerUserId: cgPlanData.data.handlerUserId,
remark: cgPlanData.data.remark,
})
state.editableTableData = cgPlanData.data.items
state.erpSpuItemsMemo = cgPlanData.data.items
}
erpSpuSimpleAll && erpSpuSimpleAll.code === 0 && (state.erpSpuSimpleAll = erpSpuSimpleAll.data)
}
// 获取货商选项 & 获取采购计划编号
@@ -401,6 +405,7 @@ const addEvent = () => {
// 底部表格行新增
const pushEvent = () => {
const newRow: RowVO = {
id: "",
erpSpuId: "",
quantity: null,
unitPrice: null,
@@ -420,6 +425,7 @@ const pushEvent = () => {
// 在指定行插入
const insertEvent = () => {
const newRow: RowVO = {
id: "",
erpSpuId: "",
quantity: null,
unitPrice: null,
@@ -442,7 +448,7 @@ const removeSelectRowEvent = () => {
if ($table) {
const selectRecords = $table.getCheckboxRecords()
if (selectRecords.length > 0) {
state.editableTableData = state.editableTableData.filter((item) => !selectRecords.some((row) => row.id === item.id))
state.editableTableData = state.editableTableData.filter((item) => !selectRecords.some((row) => row.erpSpuId === item.erpSpuId))
}
}
}
@@ -456,10 +462,10 @@ const handleClickSpuSelect = async () => {
try {
const { code, data } = await getCgPlanSpuPage().finally(() => (spuListLoading.value = false))
if (code === 0) {
state.spuDataList = data.records
state.spuDataList = data.records.map((item: RowVO) => ({ ...item, erpSpuId: item.id }))
// 勾选已经选择的商品
const target = state.spuDataList.filter((row: any) => state.selectedSpuObjs.some((item: any) => row.id === item.id))
const target = state.spuDataList.filter((row: any) => state.selectedSpuObjs.some((item: any) => row.erpSpuId === item.erpSpuId))
target.forEach((row: any) => nextTick(() => spuMultipleTableRef.value!.toggleRowSelection(row)))
}
} catch (error) {
@@ -470,12 +476,12 @@ const handleClickSpuSelect = async () => {
// 点击商品列表表格行
const rowClick = (row: any) => {
state.selectedSpuObjs.findIndex((item: any) => item.id === row.id) === -1
state.selectedSpuObjs.findIndex((item: any) => item.erpSpuId === row.erpSpuId) === -1
? // state.selectedSpuObjs.indexOf(row) === -1
state.selectedSpuObjs.push(row)
: state.selectedSpuObjs.splice(
// state.selectedSpuObjs.indexOf(row)
state.selectedSpuObjs.findIndex((item: any) => item.id === row.id),
state.selectedSpuObjs.findIndex((item: any) => item.erpSpuId === row.erpSpuId),
1,
)
console.log("click-select", state.selectedSpuObjs)
@@ -484,12 +490,12 @@ const rowClick = (row: any) => {
// 选中商品列表表格行
const handleSelect = (selectedRows: any[], row: any) => {
state.selectedSpuObjs.findIndex((item: any) => item.id === row.id) === -1
state.selectedSpuObjs.findIndex((item: any) => item.erpSpuId === row.erpSpuId) === -1
? // state.selectedSpuObjs.indexOf(row) === -1
state.selectedSpuObjs.push(row)
: state.selectedSpuObjs.splice(
// state.selectedSpuObjs.indexOf(row)
state.selectedSpuObjs.findIndex((item: any) => item.id === row.id),
state.selectedSpuObjs.findIndex((item: any) => item.erpSpuId === row.erpSpuId),
1,
)
console.log("check-select", state.selectedSpuObjs)
@@ -499,13 +505,13 @@ const handleSelect = (selectedRows: any[], row: any) => {
const handleSelectAll = (selectedRows: any[]) => {
if (selectedRows.length > 0) {
selectedRows.forEach((row: any) => {
if (state.selectedSpuObjs.findIndex((item: any) => item.id === row.id) === -1) {
if (state.selectedSpuObjs.findIndex((item: any) => item.erpSpuId === row.erpSpuId) === -1) {
state.selectedSpuObjs.push(row)
}
})
} else {
state.spuDataList.forEach((row: any) => {
const index = state.selectedSpuObjs.findIndex((item: any) => item.id === row.id)
const index = state.selectedSpuObjs.findIndex((item: any) => item.erpSpuId === row.erpSpuId)
if (index !== -1) {
state.selectedSpuObjs.splice(index, 1)
}
@@ -525,19 +531,21 @@ const handleSelectDialogConfirm = () => {
// 筛选新勾选的项
const addedItems = state.selectedSpuObjs
.map((item: any) => ({ ...item, erpSpuId: item.id }))
.filter((item: any) => !state.editableTableData.some((editableTableItem: RowVO) => editableTableItem.id === item.id))
.filter((item: any) => !state.editableTableData.some((editableTableItem: RowVO) => editableTableItem.erpSpuId === item.erpSpuId))
.map((addItem) => {
if (state.erpSpuItemsMemo.some((item: any) => item.erpSpuId === addItem.erpSpuId)) return addItem
return { ...addItem, isNew: true }
}) // 为新增的数据项添加isNew标志，若该项原本已经存在，则不添加isNew标志
// 仅添加新勾选的项
// state.editableTableData.push(...addedItems)
state.editableTableData = [...state.editableTableData, ...addedItems]
// 筛选取消勾选的项
const removedItems = state.editableTableData.filter(
(item: any) => !state.selectedSpuObjs.some((selectedItem: any) => selectedItem.id === item.id),
(item: any) => !state.selectedSpuObjs.some((selectedItem: any) => selectedItem.erpSpuId === item.erpSpuId),
)
// 仅移除取消勾选的项
state.editableTableData = state.editableTableData.filter(
(item: any) => !removedItems.some((removeItem: any) => removeItem.id === item.id),
(item: any) => !removedItems.some((removeItem: any) => removeItem.erpSpuId === item.erpSpuId),
)
// state.editableTableData.push(item)
// nextTick(() => {
@@ -555,7 +563,7 @@ const cgPlanSpuItems = computed(() => {
return state.editableTableData.map((item: any) => {
const unit = item.erpUnitVos.find((unitItem: any) => unitItem.id === item.unitId)
return {
id: "",
id: item.isNew ? undefined : item.id,
erpSpuId: item.erpSpuId,
quantity: item.quantity,
unitPrice: unit.purchasePrice ? storePrice(unit?.purchasePrice) : 0,
@@ -622,17 +630,18 @@ const submitData = async () => {
try {
loading.value = true
console.log("提交的数据：", {
const _pa = {
...baseDataForm,
items: cgPlanSpuItems.value,
})
}
const res = await addObj({
...baseDataForm,
items: cgPlanSpuItems.value,
}).finally(() => (loading.value = false))
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("添加成功")
useMessage().success(baseDataForm.id ? "修改成功" : "添加成功")
return true
} else {
useMessage().error(res.msg)
@@ -661,15 +670,4 @@ const clearData = () => {
onMounted(() => {
getInitData()
})
// const onSubmit = async () => {
// 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
// }
// }
</script>