销售订单 UI/UX

main
siontion 7 months ago
parent 93f8a828f5
commit 75a8548fb0

@ -1,5 +1,10 @@
import request from '@/config/axios'
// 物料列表获取
export const GetBaseMaterialList = async (data: any) => {
return await request.post({ url: `/DistributionBoxTesting/GetBaseMaterialList`, data })
}
// 物料列表获取
export const getBaseMaterialPaging = async (data: any) => {
return await request.post({ url: `/DistributionBoxTesting/GetPagingBaseMaterialList`, data })

@ -48,17 +48,21 @@ const xGrid = ref()
const gridOptionsA: any = reactive({
columns: [
{ field: 'PurchaserHqCode', title: '采购方总部编码', width: '120px', fixed: 'left' },
{ field: 'SoNo', title: '销售订单号', sortable: true, width: '200px', fixed: 'left' },
{ field: 'SupplierCode', title: '供应商编码', sortable: true, width: '160px' },
{ field: 'BuyerCode', title: '采购方公司编码', width: '160px' },
{ field: 'BuyerName', title: '采购方公司名称', width: '160px' },
{ field: 'BuyerProvince', title: '采购方公司省份', sortable: true, width: '160px' },
{ field: 'SoStatus', title: '销售订单状态', sortable: true, width: '160px' },
{ field: 'OwnerId', title: '数据拥有方', sortable: true, width: '160px' },
{ field: 'OpenId', title: '数据可见方', sortable: true, width: '160px' },
{ field: 'DataSource', title: '数据来源', sortable: true, width: '160px' },
{ field: 'DataSourceCreatetime', title: '来源数据创建时间', sortable: true, width: '160px' },
{ field: 'BuyerName', title: '采购方公司名称', fixed: 'left'},
{ field: 'ProductAmount', title: '采购数量', fixed: 'left'},
{ field: 'SoNo', title: '销售订单号', fixed: 'left' },
{ field: 'ProductCode', title: '物料编码'},
{ field: 'ProductName', title: '物料名称'},
{ field: 'ProductUnit', title: '物料单位'},
// { field: 'PurchaserHqCode', title: '', width: '120px', fixed: 'left' },
// { field: 'SupplierCode', title: '', sortable: true, width: '160px' },
// { field: 'BuyerCode', title: '', width: '160px' },
// { field: 'BuyerProvince', title: '', sortable: true, width: '160px' },
// { field: 'SoStatus', title: '', sortable: true, width: '160px' },
// { field: 'OwnerId', title: '', sortable: true, width: '160px' },
// { field: 'OpenId', title: '', sortable: true, width: '160px' },
// { field: 'DataSource', title: '', sortable: true, width: '160px' },
// { field: 'DataSourceCreatetime', title: '', sortable: true, width: '160px' },
{ title: '操作', width: 160, fixed: 'right', slots: { default: 'operate' } }
],
pagerConfig: {
@ -76,10 +80,11 @@ const gridOptionsA: any = reactive({
titleWidth: 160,
titleAlign: 'right',
items: [
{ field: 'PurchaserHqCode', title: '采购方总部编码', span: 8, itemRender: { name: '$input', props: { placeholder: '请输入采购方总部编码' } } },
{ field: 'SoNo', title: '销售订单号', span: 8, itemRender: { name: '$input', props: { placeholder: '请输入销售订单号' } } },
{ field: 'BuyerCode', title: '采购方公司编码', span: 8, itemRender: { name: '$input', props: { placeholder: '请输入采购方公司编码' } } },
{ field: 'BuyerName', title: '采购方公司名称', span: 8, itemRender: { name: '$input', props: { placeholder: '请输入采购方公司名称' } } },
// { field: 'PurchaserHqCode', title: '', span: 8, itemRender: { name: '$input', props: { placeholder: '' } } },
{ field: 'SoNo', title: '销售订单号', span: 8, itemRender: { name: '$input', props: { placeholder: '请输入销售订单号' } } },
{ field: 'ProductCode', title: '物料编码', span: 8, itemRender: { name: '$input', props: { placeholder: '请输入物料编码' } } },
// { field: 'BuyerCode', title: '', span: 8, itemRender: { name: '$input', props: { placeholder: '' } } },
{ span: 24, align: 'center', collapseNode: true, itemRender: { name: '$buttons', children: [{ props: { type: 'submit', content: '查询', status: 'primary' } }, { props: { type: 'reset', content: '重置' } }] } }
]
},

@ -2,67 +2,67 @@
<div class="xyp-sale-order-form" v-if="refShow">
<vxe-form title-colon ref="refFormA" title-align="right" title-width="150" :data="formDataA" :rules="formRulesA"
@submit="fnSubmitA" @reset="fnResetA" custom-layout>
<vxe-modal v-model="refShow" width="960" height="770" show-zoom show-footer>
<vxe-modal v-model="refShow" width="960" height="300" show-zoom show-footer>
<template #title>
<span style="color:#ffffff">{{ modalTitle }}</span>
</template>
<template #default>
<vxe-form-item title="采购方总部编码" field="PurchaserHqCode" span="12">
<!-- <vxe-form-item title="采购方总部编码" field="PurchaserHqCode" span="20">
<template #default="params">
<div style="width: 196px;">{{ params.data.PurchaserHqCode }}</div>
</template>
</vxe-form-item>
<vxe-form-item title="销售订单号" field="SoNo" span="12">
</vxe-form-item> -->
<vxe-form-item title="销售订单号" field="SoNo" span="20">
<template #default="params">
<div style="width: 196px;">{{ params.data.SoNo }}</div>
</template>
</vxe-form-item>
<vxe-form-item title="供应商编码" field="SupplierCode" span="12">
<!-- <vxe-form-item title="供应商编码" field="SupplierCode" span="20">
<template #default="params">
<div style="width: 196px;">{{ params.data.SupplierCode }}</div>
</template>
</vxe-form-item>
<vxe-form-item title="采购方公司编码" field="BuyerCode" span="12">
<vxe-form-item title="采购方公司编码" field="BuyerCode" span="20">
<template #default="params">
<div style="width: 196px;">{{ params.data.BuyerCode }}</div>
</template>
</vxe-form-item>
<vxe-form-item title="采购方公司名称" field="BuyerName" span="12">
</vxe-form-item> -->
<vxe-form-item title="采购方公司名称" field="BuyerName" span="20">
<template #default="params">
<div style="width: 196px;">{{ params.data.BuyerName }}</div>
</template>
</vxe-form-item>
<vxe-form-item title="采购方公司省份" field="BuyerProvince" span="12">
<!-- <vxe-form-item title="采购方公司省份" field="BuyerProvince" span="20">
<template #default="params">
<div style="width: 196px;">{{ params.data.BuyerProvince }}</div>
</template>
</vxe-form-item>
<vxe-form-item title="品类编码" field="CategoryCode" span="12">
<vxe-form-item title="品类编码" field="CategoryCode" span="20">
<template #default="params">
<div style="width: 196px;">{{ params.data.CategoryCode }}</div>
</template>
</vxe-form-item>
<vxe-form-item title="种类编码" field="SubclassCode" span="12">
<vxe-form-item title="种类编码" field="SubclassCode" span="20">
<template #default="params">
<div style="width: 196px;">{{ params.data.SubclassCode }}</div>
</template>
</vxe-form-item>
<vxe-form-item title="销售订单状态" field="SoStatus" span="12">
<vxe-form-item title="销售订单状态" field="SoStatus" span="20">
<template #default="params">
<div style="width: 196px;">{{ params.data.SoStatus }}</div>
</template>
</vxe-form-item>
<vxe-form-item title="销售订单行项目号" field="SoItemNo" span="12">
<vxe-form-item title="销售订单行项目号" field="SoItemNo" span="20">
<template #default="params">
<div style="width: 196px;">{{ params.data.SoItemNo }}</div>
</template>
</vxe-form-item>
<vxe-form-item title="采购订单行项目ID" field="PoItemId" span="12">
<vxe-form-item title="采购订单行项目ID" field="PoItemId" span="20">
<template #default="params">
<div style="width: 196px;">{{ params.data.PoItemId }}</div>
</template>
</vxe-form-item>
<vxe-form-item title="物资编码" field="ProductCode" span="12">
</vxe-form-item> -->
<vxe-form-item title="物资编码" field="ProductCode" span="20">
<template #default="params">
<template v-if="formTypeA == 'edit'">
<vxe-input v-model="params.data.ProductCode" placeholder="请输入物资编码" clearable
@ -73,7 +73,7 @@
</template>
</template>
</vxe-form-item>
<vxe-form-item title="物资名称" field="ProductName" span="12">
<vxe-form-item title="物资名称" field="ProductName" span="20">
<template #default="params">
<template v-if="formTypeA == 'edit'">
<vxe-input v-model="params.data.ProductName" placeholder="请输入物资名称" clearable
@ -84,7 +84,7 @@
</template>
</template>
</vxe-form-item>
<vxe-form-item title="物资单位" field="ProductUnit" span="12">
<vxe-form-item title="物资单位" field="ProductUnit" span="20">
<template #default="params">
<template v-if="formTypeA == 'edit'">
<vxe-input v-model="params.data.ProductUnit" placeholder="请输入物资单位" clearable
@ -95,7 +95,7 @@
</template>
</template>
</vxe-form-item>
<vxe-form-item title="物资数量" field="ProductAmount" span="12">
<vxe-form-item title="物资数量" field="ProductAmount" span="20">
<template #default="params">
<template v-if="formTypeA == 'edit'">
<vxe-input v-model="params.data.ProductAmount" placeholder="请输入物资数量" clearable
@ -106,17 +106,17 @@
</template>
</template>
</vxe-form-item>
<vxe-form-item title="数据拥有方" field="OwnerId" span="12">
<!-- <vxe-form-item title="数据拥有方" field="OwnerId" span="20">
<template #default="params">
<div style="width: 196px;">{{ params.data.OwnerId }}</div>
</template>
</vxe-form-item>
<vxe-form-item title="数据可见方" field="OpenId" span="12">
<vxe-form-item title="数据可见方" field="OpenId" span="20">
<template #default="params">
<div style="width: 196px;">{{ params.data.OpenId }}</div>
</template>
</vxe-form-item>
<vxe-form-item title="数据来源" field="DataSource" span="12">
<vxe-form-item title="数据来源" field="DataSource" span="20">
<template #default="params">
<div style="width: 196px;">
<template v-if="params.data.DataSource == 0">
@ -131,11 +131,11 @@
</div>
</template>
</vxe-form-item>
<vxe-form-item title="来源数据创建时间" field="DataSourceCreatetime" span="12">
<vxe-form-item title="来源数据创建时间" field="DataSourceCreatetime" span="20">
<template #default="params">
<div style="width: 196px;">{{ params.data.DataSourceCreatetime }}</div>
</template>
</vxe-form-item>
</vxe-form-item> -->
</template>
<template #footer>
<template v-if="formTypeA == 'edit'">
@ -144,6 +144,7 @@
<template v-else>
</template>
<!-- <vxe-button type="reset" content="重置"></vxe-button> -->
<vxe-button type="reset" content="取消" @click="fnEventCancel"></vxe-button>
</template>
</vxe-modal>
</vxe-form>
@ -156,6 +157,7 @@ import { VXETable } from 'vxe-table'
import dayjs from 'dayjs'
import { map as _map } from 'lodash'
import * as SaleOrderApi from '@/api/gw/saleOrder'
import * as BaseMaterialApi from '@/api/gw/baseMaterial'
// [success]
const emit = defineEmits(['success'])
//
@ -207,8 +209,10 @@ const formRulesA: any = ref({
{ required: true, message: '请输入物资数量' }
],
})
//
onMounted(() => {
})
//
const open = async (type: string, row?: any) => {
@ -349,5 +353,9 @@ const fnResetA = () => {
"ProductAmount": "",
}
}
//
const fnEventCancel = () => {
refShow.value = false
}
</script>
<style scoped></style>
Loading…
Cancel
Save