采购名录编写
This commit is contained in:
parent
1ffdcb4b23
commit
a95c43ed64
|
|
@ -12,7 +12,7 @@
|
|||
<div class="home2Item">
|
||||
<blockquote class="homeItem2Index">
|
||||
<div class="header-wrapper">
|
||||
<span>公司</span>
|
||||
<span>供应商</span>
|
||||
<div class="fold-button" @click="toggleFold">
|
||||
<span>{{ isFold ? '展开' : '收起' }}</span>
|
||||
<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 {
|
||||
label: 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>
|
||||
<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>
|
||||
<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>
|
||||
<style scoped lang="scss">
|
||||
.departmentStructure {
|
||||
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue