njzscloud-dispose-web/src/pages/wh/sales-order/SalesOrder.vue

154 lines
5.7 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<template>
<FormPage
ref="formPage"
:action-column="actionColumn"
:left-tools="leftTools"
:paging="paging">
<template #searchFormItem="{ searchForm }">
<!-- <ElFormItem label="Id">
<ElInput
v-model="searchForm.id"
placeholder="Id"/>
</ElFormItem> -->
<ElFormItem label="编号">
<ElInput v-model="searchForm.sn" placeholder="编号"/>
</ElFormItem>
<!-- JinXingZhong-进行中、YiFaHuo-已发货、YiChuKu-已出库、YiQuXiao--已取消 - -->
<!-- <ElFormItem label="状态">
<ElInput v-model="searchForm.salesOrderStatus" placeholder="状态" />
</ElFormItem> -->
<ElFormItem label="购买方客户">
<ElInput v-model="searchForm.customerId" placeholder="购买方客户"/>
</ElFormItem>
<!-- JinXingZhong--进行中、YiFaHuo--已发货、YiChuKu--已出库、YiQuXiao--已取消 -->
<!-- <ElFormItem label="下单日期">
<ElInput v-model="searchForm.orderDate" placeholder="下单日期" />
</ElFormItem>
<ElFormItem label="发货日期">
<ElInput v-model="searchForm.shipmentDate" placeholder="发货日期" />
</ElFormItem>
<ElFormItem label="产品分类">
<ElInput v-model="searchForm.goodsCategoryId" placeholder="产品分类" />
</ElFormItem> -->
<ElFormItem label="分类名称">
<ElInput v-model="searchForm.goodsCategoryName" placeholder="分类名称"/>
</ElFormItem>
<ElFormItem label="产品">
<ElInput v-model="searchForm.goodsId" placeholder="产品"/>
</ElFormItem>
<ElFormItem label="产品名称">
<ElInput v-model="searchForm.goodsName" placeholder="产品名称"/>
</ElFormItem>
<ElFormItem label="产品编码">
<ElInput v-model="searchForm.goodSn" placeholder="产品编码"/>
</ElFormItem>
<ElFormItem label="数量">
<ElInput v-model="searchForm.quantity" placeholder="数量"/>
</ElFormItem>
<!--<ElFormItem label="计量单位">
<ElInput v-model="searchForm.unit" placeholder="计量单位" />
</ElFormItem>
<ElFormItem label="总金额">
<ElInput v-model="searchForm.totalMoney" placeholder="总金额" />
</ElFormItem>
<ElFormItem label="备注">
<ElInput v-model="searchForm.memo" placeholder="备注" />
</ElFormItem>
<ElFormItem label="创建人">
<ElInput v-model="searchForm.creatorId" placeholder="创建人" />
</ElFormItem>
<ElFormItem label="修改人">
<ElInput v-model="searchForm.modifierId" placeholder="修改人" />
</ElFormItem> -->
<ElFormItem label="创建时间">
<ElInput v-model="searchForm.createTime" placeholder="创建时间"/>
</ElFormItem>
<ElFormItem label="修改时间">
<ElInput v-model="searchForm.modifyTime" placeholder="修改时间"/>
</ElFormItem>
</template>
<template #columns>
<!-- <ElTableColumn label="Id" prop="id" /> -->
<ElTableColumn label="编号" prop="sn"/>
<ElTableColumn label="状态" prop="salesOrderStatusTxt"/>
<!-- <ElTableColumn label="购买方客户" prop="customerId" /> -->
<ElTableColumn label="下单日期" prop="orderDate" width="100"/>
<ElTableColumn label="发货日期" prop="shipmentDate" width="100"/>
<ElTableColumn label="产品分类" prop="goodsCategoryId"/>
<ElTableColumn label="分类名称" prop="goodsCategoryName"/>
<!-- <ElTableColumn label="产品" prop="goodsId" /> -->
<ElTableColumn label="产品名称" prop="goodsName"/>
<ElTableColumn label="产品编码" prop="goodSn" width="100"/>
<ElTableColumn label="数量" prop="quantity"/>
<!-- <ElTableColumn label="计量单位" prop="unit" /> -->
<ElTableColumn label="总金额" prop="totalMoney"/>
<ElTableColumn label="备注" prop="memo"/>
<!-- <ElTableColumn label="创建人" prop="creatorId" />
<ElTableColumn label="修改人" prop="modifierId" /> -->
<ElTableColumn label="创建时间" prop="createTime" width="180"/>
<ElTableColumn label="修改时间" prop="modifyTime" width="180"/>
</template>
<SalesOrderForm ref="salesOrderForm" @edit-succ="research"/>
</FormPage>
</template>
<script lang="ts" setup>
import SalesOrderApi from '@/pages/wh/sales-order/sales-order-api.ts'
import SalesOrderForm from '@/pages/wh/sales-order/SalesOrderForm.vue'
import FormPage from '@/components/page/FormPage.vue'
import type {
ActionColumnType,
ToolType,
} from '@/components/page/a-page-type.ts'
import type { ComponentExposed } from 'vue-component-type-helpers'
const salesOrderFormIns = useTemplateRef<InstanceType<typeof SalesOrderForm>>('salesOrderForm')
const formPageIns = useTemplateRef<ComponentExposed<typeof FormPage>>('formPage')
const actionColumn = reactive<ActionColumnType<SalesOrderTypes.SearchSalesOrderResult>>({
tableActions: [
{
tooltip: '编辑',
icon: 'Edit',
action({row}) {
salesOrderFormIns.value?.open(row)
},
},
{
icon: 'Delete',
loading: false,
type: 'danger',
tooltip: '删除',
confirm: {
title: '是否删除当前数据',
},
action({row}) {
return SalesOrderApi.del([ row.id! ])
.then(() => {
ElMessage.success('删除成功')
return true
})
},
},
],
})
const leftTools: ToolType[] = [
{
icon: 'Plus',
label: '新建',
action() {
salesOrderFormIns.value?.open()
},
},
]
function research() {
formPageIns.value?.doSearch()
}
function paging(param: SalesOrderTypes.SearchSalesOrderParam) {
return SalesOrderApi.paging(param)
}
</script>