1.公司里面的控件用法（表单里的）

表单里面的用法

封装的二级弹框的用法

客户

 {label: t('public.table.customer') + ":",field: 'customerId',slot:'customerId',colProps: colSpan,},

用法

 <template #customerId="{ model, field }"><CustomerApiModal v-model:value="model[field]" @getData="getCustomerData"  /></template>

引入

import CustomerApiModal from "@/views/base/customer/CustomerApiModal.vue";

方法

 const getCustomerData=(data)=>{setFieldsValue({customerName:data.name})}

承运商

 {label: t('public.table.supplier') + ":",field: 'supplierId',slot:'supplierId',colProps: colSpan,},

用法

 <template #supplierId="{ model, field }"><SupplierApiModal v-model:value="model[field]"  @getData="getSupplierData"   /></template>

引入

  import SupplierApiModal from "@/views/base/supplier/SupplierApiModal.vue";

方法

 const getSupplierData =(data)=>{setFieldsValue({supplierName:data.name})}

车辆（车牌）

 {label: t('public.table.vehicle') + ":",field: 'vehicleId',slot:'vehicleId',colProps: colSpan,},

用法

 <template #vehicleId="{ model, field }"><VehicleApiModal v-model:value="model[field]" @getData="getVehicleData" /></template>

引入

import VehicleApiModal from "@/views/base/vehicle/VehicleApiModal.vue";

方法

 const getVehicleData=(data)=>{setFieldsValue({plateNum:data.plateNum,vehicleTypeId:data.vehicleTypeId,vehicleTypeName:data.vehicleTypeName,})}

地址点

 {label: t('public.table.address') + ":",field: 'addressId',slot:'addressId',colProps: colSpan,},

用法

 <template #addressId="{ model, field }"><AddressApiModal v-model:value="model[field]" @getData="getAddressData" /></template>

引入

  import AddressApiModal from  "@/views/base/address/AddressApiModal.vue";

方法

 const getAddressData=(data)=>{setFieldsValue({addressName:data.name,})}

产品

 {label: t('public.table.sku') + ":",field: 'skuId',slot:'skuId',colProps: colSpan,},

用法

 <template #skuId="{ model, field }"><AddressApiModal v-model:value="model[field]" @getData="getSkuData" /></template>

引入

  import AddressApiModal from  "@/views/base/sku/SkuApiModal.vue";

方法

 const getSkuData=(data)=>{setFieldsValue({skuName:data.name,})}

人员(司机）

 {label: t('public.table.driver') + ":",field: 'driverId',slot:'driverId',colProps: colSpan,},

用法

 <template #driverId="{ model, field }"><StaffApiModalv-model:value="model[field]":queryParam="{type:StaffTypeEnum.DRIVER}"@getData="getDriverData" /></template>

引入

import StaffApiModal from "@/views/base/staff/StaffApiModal.vue";

方法

 const getDriverData=(data)=>{setFieldsValue({driverName:data.name,})}

下拉框的用法

运输服务

 {label: t('public.table.transService') + ":",field: 'transServiceId',slot:'transServiceId',colProps: colSpan,},

用法

 <template #transServiceId="{ model, field }"><TransServiceApiSelect    v-model:value="model[field]"    @getData="getTransServiceData" />  </template>

方法

 const getTransServiceData=(data)=>{clearValidate("transServiceId");setFieldsValue({})}

引入

 import TransServiceApiSelect from "@/views/base/transService/TransServiceApiSelect.vue";

银行账号

 {label: t('public.table.account') + ":",field: 'accountId',slot:'accountId',colProps: colSpan,},

用法

 <template #accountId="{ model, field }"><BankAccountApiSelect v-model:value="model[field]"  @getData="getAccountData"  /></template>

引入

  import BankAccountApiSelect from "@/views/base/bankAccount/BankAccountApiSelect.vue";

方法

 const getAccountData=(data)=>{clearValidate("accountId");setFieldsValue({})}

包装

 {label: t('public.table.package') + ":",field: 'packageCode',slot:'packageCode',colProps: colSpan,},

用法

 <template #packageCode="{ model, field }"><PackageApiSelect v-model:value="model[field]" @getData="getPackageCodeData" /></template>

引入

   import PackageApiSelect from "@/views/base/package/PackageApiSelect.vue";

方法

 const getPackageCodeData=(data)=>{clearValidate("packageCode");setFieldsValue({})}

单位

 {label: t('public.table.uom') + ":",field: 'uomId',slot:'uomId',colProps: colSpan,},

用法

 <template #uomId="{ model, field }"><UomApiSelect v-model:value="model[field]" @getData="getUomData" /></template>

引入

 import UomApiSelect from "@/views/base/package/UomApiSelect.vue";

方法

 const getUomData=(data)=>{clearValidate("uomId");setFieldsValue({})}

货品分类

 {label: t('public.table.skuType') + ":",field: 'skuTypeId',slot:'skuTypeId',colProps: colSpan,},

用法

 <template #skuTypeId="{ model, field }"><SkuTypeApiSelect v-model:value="model[field]"  @getData="getSkuTypeData" /></template>

引入

import SkuTypeApiSelect from "@/views/base/skuType/SkuTypeApiSelect.vue";

方法

 const getSkuTypeData=(data)=>{clearValidate("skuTypeId");setFieldsValue({})}

批次属性

 {label: t('public.table.attribute') + ":",field: 'attributeId',slot:'attributeId',colProps: colSpan,},

用法

 <template #attributeId="{ model, field }"><LotApiSelect v-model:value="model[field]" @getData="getAttributeData"  /></template>

引入

  import LotApiSelect from '@/views/base/lot/LotApiSelect.vue'

方法

 const getAttributeData=(data)=>{clearValidate("attributeId");setFieldsValue({})}

下拉框

/** 字典查询 */
export const dictMap = await dicDictList([DicCodeEnum.TRANS_SCHEDULER_STATUS,
]);/** 字典表 */
export const dict: any = {
DicTransSchedulerStatusOptions: dictMap[DicCodeEnum.TRANS_SCHEDULER_STATUS],
};

状态下拉框（多选）

 {label: t('public.table.status') + ":",field: 'statusList',component: 'Select',componentProps: {mode:"tags",options: dict.DicTransSchedulerStatusOptions,showSearch: true,optionFilterProp: 'label',},colProps: colSpan,},

日期带时分的

{label: t('public.table.createTime') + ":",field: 'createTimeStart',component: 'DatePicker',componentProps:{showNow:true,format:"YYYY-MM-DD HH:mm",valueFormat:"YYYY-MM-DD HH:mm:ss",showTime:{ defaultValue: dayjs('00:00', 'HH:mm') },style: {width: '100%',},},colProps: colSpan,},{label: t('public.table.arrow') + ":",field: 'createTimeToEnd',component: 'DatePicker',componentProps:{showNow:true,format:"YYYY-MM-DD HH:mm",valueFormat:"YYYY-MM-DD HH:mm:ss",showTime:{ defaultValue: dayjs('00:00', 'HH:mm') },style: {width: '100%',},},colProps: colSpan,},

数字框

  {label: t('public.table.overrPercentage') + ":",field: 'overrPercentage',component: 'InputNumber',defaultValue: NumberEnum.ZERO,componentProps: {min: NumberEnum.ZERO,max: NumberEnum.MAX,precision: PrecisionEnum.MEASURE,formatter: transformNum,},colProps: colSpan,},

开关

  {label: t('public.table.enableFlag') + ":",field: 'enableFlag',component: 'Select',defaultValue:DicYesNoNumberEnum.YES,componentProps: {options: dict.DicYesNoIntOptions,showSearch: true,optionFilterProp: 'label',},colProps: colSpan,},