采购名录编写
This commit is contained in:
parent
1ffdcb4b23
commit
a95c43ed64
|
|
@ -12,7 +12,7 @@
|
||||||
<div class="home2Item">
|
<div class="home2Item">
|
||||||
<blockquote class="homeItem2Index">
|
<blockquote class="homeItem2Index">
|
||||||
<div class="header-wrapper">
|
<div class="header-wrapper">
|
||||||
<span>公司</span>
|
<span>供应商</span>
|
||||||
<div class="fold-button" @click="toggleFold">
|
<div class="fold-button" @click="toggleFold">
|
||||||
<span>{{ isFold ? '展开' : '收起' }}</span>
|
<span>{{ isFold ? '展开' : '收起' }}</span>
|
||||||
<Icon name="LineMdPerson" :style="{ transform: isFold ? 'rotate(90deg)' : 'rotate(265deg)' }"></Icon>
|
<Icon name="LineMdPerson" :style="{ transform: isFold ? 'rotate(90deg)' : 'rotate(265deg)' }"></Icon>
|
||||||
|
|
|
||||||
|
|
@ -1,33 +1,58 @@
|
||||||
export interface ModelValue {
|
|
||||||
/**
|
|
||||||
* @snowFlakeId 部门id
|
|
||||||
*/
|
|
||||||
snowFlakeId?: string | number
|
|
||||||
/**
|
|
||||||
* @name 部门名称
|
|
||||||
*/
|
|
||||||
name: string
|
|
||||||
/**
|
|
||||||
* @name 父级部门id
|
|
||||||
*/
|
|
||||||
parentId?: string | number
|
|
||||||
/**
|
|
||||||
* @name 部门负责人id
|
|
||||||
*/
|
|
||||||
leaderUserId?: string | number
|
|
||||||
/**
|
|
||||||
* @name 备注
|
|
||||||
*/
|
|
||||||
remark?: string
|
|
||||||
}
|
|
||||||
export const modelDefaultValue: ModelValue = {
|
|
||||||
snowFlakeId: '',
|
|
||||||
name: '',
|
|
||||||
leaderUserId: '',
|
|
||||||
remark: '',
|
|
||||||
}
|
|
||||||
|
|
||||||
|
export interface modelDefaultValue {
|
||||||
|
snowFlakeId?: string,
|
||||||
|
commodity: string,
|
||||||
|
specifications: string,
|
||||||
|
brand: string,
|
||||||
|
units:string,
|
||||||
|
commodityType:string,
|
||||||
|
inventory:string,
|
||||||
|
maxNumber:string,
|
||||||
|
warningValue:string,
|
||||||
|
replenishment?:string
|
||||||
|
}
|
||||||
export interface Role {
|
export interface Role {
|
||||||
label: string
|
label: string
|
||||||
value: string
|
value: string
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
export interface userInterface {
|
||||||
|
/**
|
||||||
|
* @snowFlakeId
|
||||||
|
*/
|
||||||
|
snowFlakeId?: string
|
||||||
|
/**
|
||||||
|
* @name 用户名_必传
|
||||||
|
*/
|
||||||
|
name: string
|
||||||
|
/**
|
||||||
|
* @sex 性别_必传
|
||||||
|
*/
|
||||||
|
sex: string
|
||||||
|
/**
|
||||||
|
* @phoneNumber 手机号_必传
|
||||||
|
*/
|
||||||
|
phoneNumber: string
|
||||||
|
/**
|
||||||
|
* @phoneNumber 账号状态_必传
|
||||||
|
*/
|
||||||
|
|
||||||
|
status: string
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @authClient 授权的客户端_必传
|
||||||
|
*/
|
||||||
|
|
||||||
|
authClient: any[]
|
||||||
|
/**
|
||||||
|
* @deptIds 所属部门id_必传
|
||||||
|
*/
|
||||||
|
|
||||||
|
deptIds?: any[]
|
||||||
|
/**
|
||||||
|
* @roleIds 所属角色id_必传
|
||||||
|
*/
|
||||||
|
|
||||||
|
roleIds?: any[]
|
||||||
|
}
|
||||||
|
|
@ -1,9 +1,447 @@
|
||||||
<template>
|
<template>
|
||||||
<div>采购名录</div>
|
<div class="departmentStructure">
|
||||||
|
<TablePro ref="tableRef" :request-api="reqApi" :search-form-options="searchFormOptions" :columns="columns"
|
||||||
|
:isPageTable="true">
|
||||||
|
<template #headerExtra>
|
||||||
|
<n-button strong secondary type="primary" @click="addDepartmentStructure"> 添加库存</n-button>
|
||||||
|
</template>
|
||||||
|
</TablePro>
|
||||||
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script setup lang="ts">
|
<script setup lang="tsx">
|
||||||
|
import { NButton, useModal, type FormInst } from "naive-ui";
|
||||||
|
import { reactive, ref } from "vue";
|
||||||
|
import type { modelDefaultValue } from "@/views/personnelManagement/departmentStructure/index.ts";
|
||||||
|
import { TablePro, type TableProProps, FormPro, type FormItemOptions, type TableProInst } from "@/components";
|
||||||
|
|
||||||
|
type TableType = TableProProps<any, any>
|
||||||
|
import api from "@/axios";
|
||||||
|
|
||||||
|
const modal = useModal();
|
||||||
|
|
||||||
|
const form = ref<FormInst | null>(null);
|
||||||
|
const reqApi: TableType["requestApi"] = (params) => {
|
||||||
|
return new Promise((resolve: any) => {
|
||||||
|
resolve({
|
||||||
|
code: 200,
|
||||||
|
data: {
|
||||||
|
pages: "2",
|
||||||
|
current: "1",
|
||||||
|
records: [
|
||||||
|
{
|
||||||
|
commodity: "金煌芒果",
|
||||||
|
specifications: "无",
|
||||||
|
brand: "无",
|
||||||
|
units: "斤",
|
||||||
|
commodityType: "蔬菜豆制品",
|
||||||
|
inventory: 99,
|
||||||
|
maxNumber: 99,
|
||||||
|
warningValue: 10,
|
||||||
|
replenishment: "否"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
commodity: "大红薯",
|
||||||
|
specifications: "无",
|
||||||
|
brand: "无",
|
||||||
|
units: "斤",
|
||||||
|
commodityType: "蔬菜豆制品",
|
||||||
|
inventory: 99,
|
||||||
|
maxNumber: 99,
|
||||||
|
warningValue: 10,
|
||||||
|
replenishment: "是"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
commodity: "紫叶生菜",
|
||||||
|
specifications: "无",
|
||||||
|
brand: "无",
|
||||||
|
units: "斤",
|
||||||
|
commodityType: "蔬菜豆制品",
|
||||||
|
inventory: 99,
|
||||||
|
maxNumber: 99,
|
||||||
|
warningValue: 10,
|
||||||
|
replenishment: "否"
|
||||||
|
}, {
|
||||||
|
commodity: "芥菜",
|
||||||
|
specifications: "无",
|
||||||
|
brand: "无",
|
||||||
|
units: "斤",
|
||||||
|
commodityType: "蔬菜豆制品",
|
||||||
|
inventory: 99,
|
||||||
|
maxNumber: 99,
|
||||||
|
warningValue: 10,
|
||||||
|
replenishment: "是"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
size: "5",
|
||||||
|
total: "10",
|
||||||
|
},
|
||||||
|
success: "成功"
|
||||||
|
});
|
||||||
|
});
|
||||||
|
};
|
||||||
|
const searchFormOptions = reactive<TableType["searchFormOptions"]>({
|
||||||
|
name: {
|
||||||
|
type: "input",
|
||||||
|
label: "名称"
|
||||||
|
},
|
||||||
|
type: {
|
||||||
|
type: "select",
|
||||||
|
label: "所有类型",
|
||||||
|
options: [
|
||||||
|
{
|
||||||
|
value: "蔬菜豆制品",
|
||||||
|
label: "蔬菜豆制品"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: "肉类",
|
||||||
|
label: "肉类"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: "禽类",
|
||||||
|
label: "禽类"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: "烧腊类",
|
||||||
|
label: "烧腊类"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: "水产冻货",
|
||||||
|
label: "水产冻货"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: "豆品蛋类",
|
||||||
|
label: "豆品蛋类"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: "米油杂粮",
|
||||||
|
label: "米油杂粮"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: "调料干货",
|
||||||
|
label: "调料干货"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: "厨房用品",
|
||||||
|
label: "厨房用品"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: "饮品",
|
||||||
|
label: "饮品"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
goods: {
|
||||||
|
type: "select",
|
||||||
|
label: "是否急需补货",
|
||||||
|
options: [{
|
||||||
|
value: "否",
|
||||||
|
label: "否"
|
||||||
|
}, {
|
||||||
|
value: "是",
|
||||||
|
label: "是"
|
||||||
|
}],
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
const columns = ref<TableType["columns"]>([
|
||||||
|
{
|
||||||
|
key: "commodity",
|
||||||
|
title: "商品名称",
|
||||||
|
width: 150
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: "specifications",
|
||||||
|
title: "规格",
|
||||||
|
width: 150
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: "brand",
|
||||||
|
title: "品牌",
|
||||||
|
width: 150
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: "units",
|
||||||
|
title: "单位",
|
||||||
|
width: 150
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: "commodityType",
|
||||||
|
title: "商品类型",
|
||||||
|
width: 150
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: "inventory",
|
||||||
|
title: "库存",
|
||||||
|
width: 150
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: "maxNumber",
|
||||||
|
title: "最大数量",
|
||||||
|
width: 150
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: "warningValue",
|
||||||
|
title: "警戒值",
|
||||||
|
width: 150
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: "replenishment",
|
||||||
|
title: "急需补货",
|
||||||
|
width: 150
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: "",
|
||||||
|
title: "操作",
|
||||||
|
render: (value: modelDefaultValue) => {
|
||||||
|
return (
|
||||||
|
<div style={{ display: "flex" }}>
|
||||||
|
<n-button
|
||||||
|
strong
|
||||||
|
secondary
|
||||||
|
style={{ marginLeft: "10px" }}
|
||||||
|
type='warning'
|
||||||
|
onClick={()=>{
|
||||||
|
console.log(value,'000');
|
||||||
|
title.value = `修改库存`
|
||||||
|
userValue.value.commodity = value.commodity
|
||||||
|
userValue.value.brand = value.brand
|
||||||
|
userValue.value.warningValue = value.warningValue
|
||||||
|
userValue.value.units = value.units
|
||||||
|
userValue.value.inventory = value.inventory
|
||||||
|
userValue.value.maxNumber = value.maxNumber
|
||||||
|
userValue.value.specifications = value.specifications
|
||||||
|
userValue.value.commodityType = value.commodityType
|
||||||
|
|
||||||
|
modalRef.value = modal.create({
|
||||||
|
title: title.value,
|
||||||
|
preset: 'card',
|
||||||
|
style: {
|
||||||
|
width: '600px',
|
||||||
|
},
|
||||||
|
content: () => (
|
||||||
|
<>
|
||||||
|
<FormPro labelWidth='100' ref={form} v-model:value={userValue.value} form-item-options={formOptionsUser} />
|
||||||
|
</>
|
||||||
|
),
|
||||||
|
footer: () => (
|
||||||
|
<div
|
||||||
|
style={{
|
||||||
|
display: 'flex',
|
||||||
|
justifyContent: 'flex-end',
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<n-button
|
||||||
|
loading={loading.value}
|
||||||
|
style={{ marginRight: '10px' }}
|
||||||
|
type='primary'
|
||||||
|
onClick={() => {
|
||||||
|
resetModelValue()
|
||||||
|
// addUserOrUpdate(value.snowFlakeId)
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
确认
|
||||||
|
</n-button>
|
||||||
|
<n-button
|
||||||
|
onClick={() => {
|
||||||
|
modalRef.value.destroy()
|
||||||
|
resetModelValue()
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
取消
|
||||||
|
</n-button>
|
||||||
|
</div>
|
||||||
|
),
|
||||||
|
onAfterLeave: () => {
|
||||||
|
resetModelValue()
|
||||||
|
},
|
||||||
|
})
|
||||||
|
}}
|
||||||
|
>编辑</n-button>
|
||||||
|
<n-button type="error" style={{ margin: "0 10px" }}>
|
||||||
|
删除
|
||||||
|
</n-button>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
]);
|
||||||
|
|
||||||
|
|
||||||
|
const userDefaultValue: modelDefaultValue = {
|
||||||
|
// snowFlakeId: "",
|
||||||
|
commodity: "",
|
||||||
|
specifications: "",
|
||||||
|
brand: "",
|
||||||
|
units: "",
|
||||||
|
commodityType: "",
|
||||||
|
inventory: "",
|
||||||
|
maxNumber: "",
|
||||||
|
warningValue: ""
|
||||||
|
// replenishment:''
|
||||||
|
};
|
||||||
|
|
||||||
|
const userValue = ref<modelDefaultValue>({
|
||||||
|
...userDefaultValue
|
||||||
|
});
|
||||||
|
|
||||||
|
const resetModelValue = () => {
|
||||||
|
userValue.value = { ...userDefaultValue };
|
||||||
|
};
|
||||||
|
|
||||||
|
const addUserOrUpdate = ()=>{
|
||||||
|
form.value?.validate().then(()=>{
|
||||||
|
// loading.value = true
|
||||||
|
|
||||||
|
})
|
||||||
|
}
|
||||||
|
const formOptionsUser = reactive<FormItemOptions<any>>({
|
||||||
|
// form表单
|
||||||
|
commodity:{
|
||||||
|
type: 'input',
|
||||||
|
label: '商品名称',
|
||||||
|
required: true,
|
||||||
|
},
|
||||||
|
specifications:{
|
||||||
|
type: 'input',
|
||||||
|
label: '规格要求',
|
||||||
|
},
|
||||||
|
brand:{
|
||||||
|
type:'input',
|
||||||
|
label: '品牌',
|
||||||
|
},
|
||||||
|
units:{
|
||||||
|
type:'select',
|
||||||
|
label: '单位',
|
||||||
|
required: true,
|
||||||
|
options:[
|
||||||
|
{
|
||||||
|
value:0,
|
||||||
|
label:'个'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value:1,
|
||||||
|
label:'斤'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value:2,
|
||||||
|
label:'袋'
|
||||||
|
},
|
||||||
|
]
|
||||||
|
},
|
||||||
|
inventory:{
|
||||||
|
type:'inputNumber',
|
||||||
|
label: '库存数量',
|
||||||
|
required: true,
|
||||||
|
},
|
||||||
|
maxNumber:{
|
||||||
|
type:'inputNumber',
|
||||||
|
label:'最大数量',
|
||||||
|
required: true,
|
||||||
|
},
|
||||||
|
warningValue:{
|
||||||
|
type:'inputNumber',
|
||||||
|
label:'警戒值',
|
||||||
|
required: true,
|
||||||
|
},
|
||||||
|
commodityType:{
|
||||||
|
type:'radioGroup',
|
||||||
|
label:' 采购类型',
|
||||||
|
required: true,
|
||||||
|
options: [
|
||||||
|
{
|
||||||
|
value: 0,
|
||||||
|
label: "蔬菜豆制品"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: 1,
|
||||||
|
label: "肉类"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: 2,
|
||||||
|
label: "禽类"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: 3,
|
||||||
|
label: "烧腊类"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: 4,
|
||||||
|
label: "水产冻货"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: 5,
|
||||||
|
label: "豆品蛋类"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: 6,
|
||||||
|
label: "米油杂粮"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: 7,
|
||||||
|
label: "调料干货"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: 8,
|
||||||
|
label: "厨房用品"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: 9,
|
||||||
|
label: "饮品"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
});
|
||||||
|
const loading = ref<boolean>(false);
|
||||||
|
const modalRef = ref();
|
||||||
|
const title = ref("新增");
|
||||||
|
const addDepartmentStructure = () => {
|
||||||
|
modalRef.value = modal.create({
|
||||||
|
title: title.value,
|
||||||
|
preset: "card",
|
||||||
|
style: {
|
||||||
|
width: "600px"
|
||||||
|
},
|
||||||
|
content: () => (
|
||||||
|
<>
|
||||||
|
<FormPro labelWidth="100" ref={form} v-model:value={userValue.value} form-item-options={formOptionsUser}></FormPro>
|
||||||
|
</>
|
||||||
|
),
|
||||||
|
footer: () => (
|
||||||
|
<div
|
||||||
|
style={{
|
||||||
|
display: 'flex',
|
||||||
|
justifyContent: 'flex-end',
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<n-button
|
||||||
|
loading={loading.value}
|
||||||
|
style={{ marginRight: '10px' }}
|
||||||
|
type='primary'
|
||||||
|
onClick={() => {
|
||||||
|
addUserOrUpdate()
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
确认
|
||||||
|
</n-button>
|
||||||
|
<n-button
|
||||||
|
onClick={() => {
|
||||||
|
modalRef.value.destroy()
|
||||||
|
resetModelValue()
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
取消
|
||||||
|
</n-button>
|
||||||
|
</div>
|
||||||
|
),
|
||||||
|
onAfterLeave: () => {
|
||||||
|
resetModelValue()
|
||||||
|
},
|
||||||
|
});
|
||||||
|
};
|
||||||
</script>
|
</script>
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
|
.departmentStructure {
|
||||||
|
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
Loading…
Reference in New Issue