基本信息配置办卡返利操作客户管理指定送卡人

fujun / dxCard-admin

Browse code 基本信息配置办卡返利操作客户管理指定送卡人 master
1 parent 7c88f92 commit db7ef7fc89bd2e1e8976c70b6a0b19cac42145f4 jiangqihao authored 27 days ago

Patch

Showing 12 changed files

Ignore Space Show notes View src/views/customers/CardApplicationCustomers.api.ts
import {defHttp} from '/@/utils/http/axios'; import { useMessage } from "/@/hooks/web/useMessage"; const { createConfirm } = useMessage(); enum Api { list = '/customers/cardApplicationCustomers/list', save='/customers/cardApplicationCustomers/add', edit='/customers/cardApplicationCustomers/edit', deleteOne = '/customers/cardApplicationCustomers/delete', deleteBatch = '/customers/cardApplicationCustomers/deleteBatch', importExcel = '/customers/cardApplicationCustomers/importExcel', exportXls = '/customers/cardApplicationCustomers/exportXls', getAreaCardDeliveryPersonList = '/customers/cardApplicationCustomers/getAreaCardDeliveryPersonList', dispatch = '/customers/cardApplicationCustomers/dispatch', } /** * 导出api * @param params / export const getExportUrl = Api.exportXls; /* * 导入api / export const getImportUrl = Api.importExcel; /* * 列表接口 * @param params / export const list = (params) => defHttp.get({url: Api.list, params}); export const getAreaCardDeliveryPersonList = (params) => defHttp.get({url: Api.getAreaCardDeliveryPersonList, params}); export const dispatch = (params) => defHttp.post({url: Api.dispatch, params}); /* * 删除单个 / export const deleteOne = (params,handleSuccess) => { return defHttp.delete({url: Api.deleteOne, params}, {joinParamsToUrl: true}).then(() => { handleSuccess(); }); } /* * 批量删除 * @param params / export const batchDelete = (params, handleSuccess) => { createConfirm({ iconType: 'warning', title: '确认删除', content: '是否删除选中数据', okText: '确认', cancelText: '取消', onOk: () => { return defHttp.delete({url: Api.deleteBatch, data: params}, {joinParamsToUrl: true}).then(() => { handleSuccess(); }); } }); } /* * 保存或者更新 * @param params / export const saveOrUpdate = (params, isUpdate) => { let url = isUpdate ? Api.edit : Api.save; return defHttp.post({url: url, params}); } import {defHttp} from '/@/utils/http/axios'; import { useMessage } from "/@/hooks/web/useMessage"; const { createConfirm } = useMessage(); enum Api { list = '/customers/cardApplicationCustomers/list', save='/customers/cardApplicationCustomers/add', edit='/customers/cardApplicationCustomers/edit', deleteOne = '/customers/cardApplicationCustomers/delete', deleteBatch = '/customers/cardApplicationCustomers/deleteBatch', importExcel = '/customers/cardApplicationCustomers/importExcel', exportXls = '/customers/cardApplicationCustomers/exportXls', } /* * 导出api * @param params / export const getExportUrl = Api.exportXls; /* * 导入api / export const getImportUrl = Api.importExcel; /* * 列表接口 * @param params / export const list = (params) => defHttp.get({url: Api.list, params}); /* * 删除单个 / export const deleteOne = (params,handleSuccess) => { return defHttp.delete({url: Api.deleteOne, params}, {joinParamsToUrl: true}).then(() => { handleSuccess(); }); } /* * 批量删除 * @param params / export const batchDelete = (params, handleSuccess) => { createConfirm({ iconType: 'warning', title: '确认删除', content: '是否删除选中数据', okText: '确认', cancelText: '取消', onOk: () => { return defHttp.delete({url: Api.deleteBatch, data: params}, {joinParamsToUrl: true}).then(() => { handleSuccess(); }); } }); } /* * 保存或者更新 * @param params */ export const saveOrUpdate = (params, isUpdate) => { let url = isUpdate ? Api.edit : Api.save; return defHttp.post({url: url, params}); }

Ignore Space Show notes View

src/views/customers/CardApplicationCustomers.api.ts

import {defHttp} from '/@/utils/http/axios';
import { useMessage } from "/@/hooks/web/useMessage";

const { createConfirm } = useMessage();

enum Api {
  list = '/customers/cardApplicationCustomers/list',
  save='/customers/cardApplicationCustomers/add',
  edit='/customers/cardApplicationCustomers/edit',
  deleteOne = '/customers/cardApplicationCustomers/delete',
  deleteBatch = '/customers/cardApplicationCustomers/deleteBatch',
  importExcel = '/customers/cardApplicationCustomers/importExcel',
  exportXls = '/customers/cardApplicationCustomers/exportXls',
  getAreaCardDeliveryPersonList = '/customers/cardApplicationCustomers/getAreaCardDeliveryPersonList',
  dispatch = '/customers/cardApplicationCustomers/dispatch',
}
/**
 * 导出api
 * @param params
 */
export const getExportUrl = Api.exportXls;
/**
 * 导入api
 */
export const getImportUrl = Api.importExcel;
/**
 * 列表接口
 * @param params
 */
export const list = (params) =>
  defHttp.get({url: Api.list, params});

export const getAreaCardDeliveryPersonList = (params) =>
  defHttp.get({url: Api.getAreaCardDeliveryPersonList, params});

export const dispatch = (params) =>
  defHttp.post({url: Api.dispatch, params});

/**
 * 删除单个
 */
export const deleteOne = (params,handleSuccess) => {
  return defHttp.delete({url: Api.deleteOne, params}, {joinParamsToUrl: true}).then(() => {
    handleSuccess();
  });
}
/**
 * 批量删除
 * @param params
 */
export const batchDelete = (params, handleSuccess) => {
  createConfirm({
    iconType: 'warning',
    title: '确认删除',
    content: '是否删除选中数据',
    okText: '确认',
    cancelText: '取消',
    onOk: () => {
      return defHttp.delete({url: Api.deleteBatch, data: params}, {joinParamsToUrl: true}).then(() => {
        handleSuccess();
      });
    }
  });
}
/**
 * 保存或者更新
 * @param params
 */
export const saveOrUpdate = (params, isUpdate) => {
  let url = isUpdate ? Api.edit : Api.save;
  return defHttp.post({url: url, params});
}

import {defHttp} from '/@/utils/http/axios';
import { useMessage } from "/@/hooks/web/useMessage";

const { createConfirm } = useMessage();

enum Api {
  list = '/customers/cardApplicationCustomers/list',
  save='/customers/cardApplicationCustomers/add',
  edit='/customers/cardApplicationCustomers/edit',
  deleteOne = '/customers/cardApplicationCustomers/delete',
  deleteBatch = '/customers/cardApplicationCustomers/deleteBatch',
  importExcel = '/customers/cardApplicationCustomers/importExcel',
  exportXls = '/customers/cardApplicationCustomers/exportXls',
}
/**
 * 导出api
 * @param params
 */
export const getExportUrl = Api.exportXls;
/**
 * 导入api
 */
export const getImportUrl = Api.importExcel;
/**
 * 列表接口
 * @param params
 */
export const list = (params) =>
  defHttp.get({url: Api.list, params});

Ignore Space Show notes View src/views/customers/CardApplicationCustomers.data.ts
import {BasicColumn} from '/@/components/Table'; import {FormSchema} from '/@/components/Table'; import { rules} from '/@/utils/helper/validator'; import { render } from '/@/utils/common/renderUtils'; import { getWeekMonthQuarterYear } from '/@/utils'; //列表数据 export const columns: BasicColumn[] = [ { title: '分销客户id', align:"center", dataIndex: 'distributionCustomersId' }, { title: '分销客户姓名', align:"center", dataIndex: 'distributionCustomersName' }, { title: '分销客户手机号', align:"center", dataIndex: 'distributionCustomersPhone' }, { title: '办卡客户id', align:"center", dataIndex: 'cardApplicationId' }, { title: '办卡姓名', align:"center", dataIndex: 'cardApplicationName' }, { title: '办卡手机号', align:"center", dataIndex: 'cardApplicationPhone' }, { title: '预约单号', align:"center", dataIndex: 'reservationNumber' }, { title: '省', align:"center", dataIndex: 'province' }, { title: '市', align:"center", dataIndex: 'city' }, { title: '区', align:"center", dataIndex: 'area' }, { title: '详细地址', align:"center", dataIndex: 'address' }, { title: '预约时间', align:"center", dataIndex: 'reservationTime' }, { title: '办理手机号', align:"center", dataIndex: 'transactionPhone' }, { title: '应返还佣金', align:"center", dataIndex: 'refundableCommission' }, { title: '实际返还佣金', align:"center", dataIndex: 'actualCommission' }, { title: '返还时间', align:"center", dataIndex: 'refundableTime' }, { title: '首充金额', align:"center", dataIndex: 'amount' }, { title: '状态', align:"center", dataIndex: 'status' }, { title: '指定送卡人', align:"center", dataIndex: 'cardDeliveryPerson' }, ]; //查询数据 export const searchFormSchema: FormSchema[] = [ { label: "分销客户id", field: 'distributionCustomersId', component: 'Input', //colProps: {span: 6}, }, { label: "分销客户姓名", field: 'distributionCustomersName', component: 'Input', //colProps: {span: 6}, }, { label: "分销客户手机号", field: 'distributionCustomersPhone', component: 'Input', //colProps: {span: 6}, }, { label: "办卡客户id", field: 'cardApplicationId', component: 'Input', //colProps: {span: 6}, }, { label: "办卡姓名", field: 'cardApplicationName', component: 'Input', //colProps: {span: 6}, }, { label: "办卡手机号", field: 'cardApplicationPhone', component: 'Input', //colProps: {span: 6}, }, { label: "区", field: 'area', component: 'Input', //colProps: {span: 6}, }, { label: "详细地址", field: 'address', component: 'Input', //colProps: {span: 6}, }, { label: "办理手机号", field: 'transactionPhone', component: 'Input', //colProps: {span: 6}, }, { label: "状态", field: 'status', component: 'Input', //colProps: {span: 6}, }, { label: "指定送卡人", field: 'cardDeliveryPerson', component: 'Input', //colProps: {span: 6}, }, ]; //表单数据 export const formSchema: FormSchema[] = [ { label: '分销客户id', field: 'distributionCustomersId', component: 'Input', }, { label: '分销客户姓名', field: 'distributionCustomersName', component: 'Input', }, { label: '分销客户手机号', field: 'distributionCustomersPhone', component: 'Input', }, { label: '办卡客户id', field: 'cardApplicationId', component: 'Input', }, { label: '办卡姓名', field: 'cardApplicationName', component: 'Input', }, { label: '办卡手机号', field: 'cardApplicationPhone', component: 'Input', }, { label: '预约单号', field: 'reservationNumber', component: 'Input', }, { label: '省', field: 'province', component: 'Input', }, { label: '市', field: 'city', component: 'Input', }, { label: '区', field: 'area', component: 'Input', }, { label: '详细地址', field: 'address', component: 'Input', }, { label: '预约时间', field: 'reservationTime', component: 'DatePicker', componentProps: { showTime: true, valueFormat: 'YYYY-MM-DD HH:mm:ss' }, }, { label: '办理手机号', field: 'transactionPhone', component: 'Input', }, { label: '应返还佣金', field: 'refundableCommission', component: 'InputNumber', }, { label: '实际返还佣金', field: 'actualCommission', component: 'Input', }, { label: '返还时间', field: 'refundableTime', component: 'DatePicker', componentProps: { showTime: true, valueFormat: 'YYYY-MM-DD HH:mm:ss' }, }, { label: '首充金额', field: 'amount', component: 'InputNumber', }, { label: '状态', field: 'status', component: 'Input', }, { label: '指定送卡人', field: 'cardDeliveryPerson', component: 'Input', }, // TODO 主键隐藏字段，目前写死为ID { label: '', field: 'id', component: 'Input', show: false }, ]; // 高级查询数据 export const superQuerySchema = { distributionCustomersId: {title: '分销客户id',order: 0,view: 'text', type: 'string',}, distributionCustomersName: {title: '分销客户姓名',order: 1,view: 'text', type: 'string',}, distributionCustomersPhone: {title: '分销客户手机号',order: 2,view: 'text', type: 'string',}, cardApplicationId: {title: '办卡客户id',order: 3,view: 'text', type: 'string',}, cardApplicationName: {title: '办卡姓名',order: 4,view: 'text', type: 'string',}, cardApplicationPhone: {title: '办卡手机号',order: 5,view: 'text', type: 'string',}, reservationNumber: {title: '预约单号',order: 6,view: 'text', type: 'string',}, province: {title: '省',order: 7,view: 'text', type: 'string',}, city: {title: '市',order: 8,view: 'text', type: 'string',}, area: {title: '区',order: 9,view: 'text', type: 'string',}, address: {title: '详细地址',order: 10,view: 'text', type: 'string',}, reservationTime: {title: '预约时间',order: 11,view: 'datetime', type: 'string',}, transactionPhone: {title: '办理手机号',order: 12,view: 'text', type: 'string',}, refundableCommission: {title: '应返还佣金',order: 13,view: 'number', type: 'number',}, actualCommission: {title: '实际返还佣金',order: 14,view: 'text', type: 'string',}, refundableTime: {title: '返还时间',order: 15,view: 'datetime', type: 'string',}, amount: {title: '首充金额',order: 16,view: 'number', type: 'number',}, status: {title: '状态',order: 17,view: 'text', type: 'string',}, cardDeliveryPerson: {title: '指定送卡人',order: 18,view: 'text', type: 'string',}, }; /** * 流程表单调用这个方法获取formSchema * @param param / export function getBpmFormSchema(_formData): FormSchema[]{ // 默认和原始表单保持一致如果流程中配置了权限数据，这里需要单独处理formSchema return formSchema; } import {BasicColumn} from '/@/components/Table'; import {FormSchema} from '/@/components/Table'; import { rules} from '/@/utils/helper/validator'; import { render } from '/@/utils/common/renderUtils'; import { getWeekMonthQuarterYear } from '/@/utils'; //列表数据 export const columns: BasicColumn[] = [ { title: '分销客户id', align:"center", dataIndex: 'distributionCustomersId' }, { title: '分销客户姓名', align:"center", dataIndex: 'distributionCustomersName' }, { title: '分销客户手机号', align:"center", dataIndex: 'distributionCustomersPhone' }, { title: '办卡客户id', align:"center", dataIndex: 'cardApplicationId' }, { title: '办卡姓名', align:"center", dataIndex: 'cardApplicationName' }, { title: '办卡手机号', align:"center", dataIndex: 'cardApplicationPhone' }, { title: '预约单号', align:"center", dataIndex: 'reservationNumber' }, { title: '省', align:"center", dataIndex: 'province' }, { title: '市', align:"center", dataIndex: 'city' }, { title: '区', align:"center", dataIndex: 'area' }, { title: '详细地址', align:"center", dataIndex: 'address' }, { title: '预约时间', align:"center", dataIndex: 'reservationTime' }, { title: '办理手机号', align:"center", dataIndex: 'transactionPhone' }, { title: '应返还佣金', align:"center", dataIndex: 'refundableCommission' }, { title: '实际返还佣金', align:"center", dataIndex: 'actualCommission' }, { title: '返还时间', align:"center", dataIndex: 'refundableTime' }, { title: '首充金额', align:"center", dataIndex: 'amount' }, { title: '状态', align:"center", dataIndex: 'status' }, { title: '指定送卡人', align:"center", dataIndex: 'cardDeliveryPerson' }, ]; //查询数据 export const searchFormSchema: FormSchema[] = [ ]; //表单数据 export const formSchema: FormSchema[] = [ { label: '分销客户id', field: 'distributionCustomersId', component: 'Input', }, { label: '分销客户姓名', field: 'distributionCustomersName', component: 'Input', }, { label: '分销客户手机号', field: 'distributionCustomersPhone', component: 'Input', }, { label: '办卡客户id', field: 'cardApplicationId', component: 'Input', }, { label: '办卡姓名', field: 'cardApplicationName', component: 'Input', }, { label: '办卡手机号', field: 'cardApplicationPhone', component: 'Input', }, { label: '预约单号', field: 'reservationNumber', component: 'Input', }, { label: '省', field: 'province', component: 'Input', }, { label: '市', field: 'city', component: 'Input', }, { label: '区', field: 'area', component: 'Input', }, { label: '详细地址', field: 'address', component: 'Input', }, { label: '预约时间', field: 'reservationTime', component: 'DatePicker', componentProps: { showTime: true, valueFormat: 'YYYY-MM-DD HH:mm:ss' }, }, { label: '办理手机号', field: 'transactionPhone', component: 'Input', }, { label: '应返还佣金', field: 'refundableCommission', component: 'InputNumber', }, { label: '实际返还佣金', field: 'actualCommission', component: 'Input', }, { label: '返还时间', field: 'refundableTime', component: 'DatePicker', componentProps: { showTime: true, valueFormat: 'YYYY-MM-DD HH:mm:ss' }, }, { label: '首充金额', field: 'amount', component: 'InputNumber', }, { label: '状态', field: 'status', component: 'Input', }, { label: '指定送卡人', field: 'cardDeliveryPerson', component: 'Input', }, // TODO 主键隐藏字段，目前写死为ID { label: '', field: 'id', component: 'Input', show: false }, ]; // 高级查询数据 export const superQuerySchema = { distributionCustomersId: {title: '分销客户id',order: 0,view: 'text', type: 'string',}, distributionCustomersName: {title: '分销客户姓名',order: 1,view: 'text', type: 'string',}, distributionCustomersPhone: {title: '分销客户手机号',order: 2,view: 'text', type: 'string',}, cardApplicationId: {title: '办卡客户id',order: 3,view: 'text', type: 'string',}, cardApplicationName: {title: '办卡姓名',order: 4,view: 'text', type: 'string',}, cardApplicationPhone: {title: '办卡手机号',order: 5,view: 'text', type: 'string',}, reservationNumber: {title: '预约单号',order: 6,view: 'text', type: 'string',}, province: {title: '省',order: 7,view: 'text', type: 'string',}, city: {title: '市',order: 8,view: 'text', type: 'string',}, area: {title: '区',order: 9,view: 'text', type: 'string',}, address: {title: '详细地址',order: 10,view: 'text', type: 'string',}, reservationTime: {title: '预约时间',order: 11,view: 'datetime', type: 'string',}, transactionPhone: {title: '办理手机号',order: 12,view: 'text', type: 'string',}, refundableCommission: {title: '应返还佣金',order: 13,view: 'number', type: 'number',}, actualCommission: {title: '实际返还佣金',order: 14,view: 'text', type: 'string',}, refundableTime: {title: '返还时间',order: 15,view: 'datetime', type: 'string',}, amount: {title: '首充金额',order: 16,view: 'number', type: 'number',}, status: {title: '状态',order: 17,view: 'text', type: 'string',}, cardDeliveryPerson: {title: '指定送卡人',order: 18,view: 'text', type: 'string',}, }; /* * 流程表单调用这个方法获取formSchema * @param param */ export function getBpmFormSchema(_formData): FormSchema[]{ // 默认和原始表单保持一致如果流程中配置了权限数据，这里需要单独处理formSchema return formSchema; }

Ignore Space Show notes View

src/views/customers/CardApplicationCustomers.data.ts

import {BasicColumn} from '/@/components/Table';
import {FormSchema} from '/@/components/Table';
import { rules} from '/@/utils/helper/validator';
import { render } from '/@/utils/common/renderUtils';
import { getWeekMonthQuarterYear } from '/@/utils';
//列表数据
export const columns: BasicColumn[] = [
   {
    title: '分销客户id',
    align:"center",
    dataIndex: 'distributionCustomersId'
   },
   {
    title: '分销客户姓名',
    align:"center",
    dataIndex: 'distributionCustomersName'
   },
   {
    title: '分销客户手机号',
    align:"center",
    dataIndex: 'distributionCustomersPhone'
   },
   {
    title: '办卡客户id',
    align:"center",
    dataIndex: 'cardApplicationId'
   },
   {
    title: '办卡姓名',
    align:"center",
    dataIndex: 'cardApplicationName'
   },
   {
    title: '办卡手机号',
    align:"center",
    dataIndex: 'cardApplicationPhone'
   },
   {
    title: '预约单号',
    align:"center",
    dataIndex: 'reservationNumber'
   },
   {
    title: '省',
    align:"center",
    dataIndex: 'province'
   },
   {
    title: '市',
    align:"center",
    dataIndex: 'city'
   },
   {
    title: '区',
    align:"center",
    dataIndex: 'area'
   },
   {
    title: '详细地址',
    align:"center",
    dataIndex: 'address'
   },
   {
    title: '预约时间',
    align:"center",
    dataIndex: 'reservationTime'
   },
   {
    title: '办理手机号',
    align:"center",
    dataIndex: 'transactionPhone'
   },
   {
    title: '应返还佣金',
    align:"center",
    dataIndex: 'refundableCommission'
   },
   {
    title: '实际返还佣金',
    align:"center",
    dataIndex: 'actualCommission'
   },
   {
    title: '返还时间',
    align:"center",
    dataIndex: 'refundableTime'
   },
   {
    title: '首充金额',
    align:"center",
    dataIndex: 'amount'
   },
   {
    title: '状态',
    align:"center",
    dataIndex: 'status'
   },
   {
    title: '指定送卡人',
    align:"center",
    dataIndex: 'cardDeliveryPerson'
   },
];
//查询数据
export const searchFormSchema: FormSchema[] = [
	{
      label: "分销客户id",
      field: 'distributionCustomersId',
      component: 'Input',
      //colProps: {span: 6},
 	},
	{
      label: "分销客户姓名",
      field: 'distributionCustomersName',
      component: 'Input',
      //colProps: {span: 6},
 	},
	{
      label: "分销客户手机号",
      field: 'distributionCustomersPhone',
      component: 'Input',
      //colProps: {span: 6},
 	},
	{
      label: "办卡客户id",
      field: 'cardApplicationId',
      component: 'Input',
      //colProps: {span: 6},
 	},
	{
      label: "办卡姓名",
      field: 'cardApplicationName',
      component: 'Input',
      //colProps: {span: 6},
 	},
	{
      label: "办卡手机号",
      field: 'cardApplicationPhone',
      component: 'Input',
      //colProps: {span: 6},
 	},
	{
      label: "区",
      field: 'area',
      component: 'Input',
      //colProps: {span: 6},
 	},
	{
      label: "详细地址",
      field: 'address',
      component: 'Input',
      //colProps: {span: 6},
 	},
	{
      label: "办理手机号",
      field: 'transactionPhone',
      component: 'Input',
      //colProps: {span: 6},
 	},
	{
      label: "状态",
      field: 'status',
      component: 'Input',
      //colProps: {span: 6},
 	},
	{
      label: "指定送卡人",
      field: 'cardDeliveryPerson',
      component: 'Input',
      //colProps: {span: 6},
 	},
];
//表单数据
export const formSchema: FormSchema[] = [
  {
    label: '分销客户id',
    field: 'distributionCustomersId',
    component: 'Input',
  },
  {
    label: '分销客户姓名',
    field: 'distributionCustomersName',
    component: 'Input',
  },
  {
    label: '分销客户手机号',
    field: 'distributionCustomersPhone',
    component: 'Input',
  },
  {
    label: '办卡客户id',
    field: 'cardApplicationId',
    component: 'Input',
  },
  {
    label: '办卡姓名',
    field: 'cardApplicationName',
    component: 'Input',
  },
  {
    label: '办卡手机号',
    field: 'cardApplicationPhone',
    component: 'Input',
  },
  {
    label: '预约单号',
    field: 'reservationNumber',
    component: 'Input',
  },
  {
    label: '省',
    field: 'province',
    component: 'Input',
  },
  {
    label: '市',
    field: 'city',
    component: 'Input',
  },
  {
    label: '区',
    field: 'area',
    component: 'Input',
  },
  {
    label: '详细地址',
    field: 'address',
    component: 'Input',
  },
  {
    label: '预约时间',
    field: 'reservationTime',
    component: 'DatePicker',
    componentProps: {
       showTime: true,
       valueFormat: 'YYYY-MM-DD HH:mm:ss'
     },
  },
  {
    label: '办理手机号',
    field: 'transactionPhone',
    component: 'Input',
  },
  {
    label: '应返还佣金',
    field: 'refundableCommission',
    component: 'InputNumber',
  },
  {
    label: '实际返还佣金',
    field: 'actualCommission',
    component: 'Input',
  },
  {
    label: '返还时间',
    field: 'refundableTime',
    component: 'DatePicker',
    componentProps: {
       showTime: true,
       valueFormat: 'YYYY-MM-DD HH:mm:ss'
     },
  },
  {
    label: '首充金额',
    field: 'amount',
    component: 'InputNumber',
  },
  {
    label: '状态',
    field: 'status',
    component: 'Input',
  },
  {
    label: '指定送卡人',
    field: 'cardDeliveryPerson',
    component: 'Input',
  },
	// TODO 主键隐藏字段，目前写死为ID
	{
	  label: '',
	  field: 'id',
	  component: 'Input',
	  show: false
	},
];

// 高级查询数据
export const superQuerySchema = {
  distributionCustomersId: {title: '分销客户id',order: 0,view: 'text', type: 'string',},
  distributionCustomersName: {title: '分销客户姓名',order: 1,view: 'text', type: 'string',},
  distributionCustomersPhone: {title: '分销客户手机号',order: 2,view: 'text', type: 'string',},
  cardApplicationId: {title: '办卡客户id',order: 3,view: 'text', type: 'string',},
  cardApplicationName: {title: '办卡姓名',order: 4,view: 'text', type: 'string',},
  cardApplicationPhone: {title: '办卡手机号',order: 5,view: 'text', type: 'string',},
  reservationNumber: {title: '预约单号',order: 6,view: 'text', type: 'string',},
  province: {title: '省',order: 7,view: 'text', type: 'string',},
  city: {title: '市',order: 8,view: 'text', type: 'string',},
  area: {title: '区',order: 9,view: 'text', type: 'string',},
  address: {title: '详细地址',order: 10,view: 'text', type: 'string',},
  reservationTime: {title: '预约时间',order: 11,view: 'datetime', type: 'string',},
  transactionPhone: {title: '办理手机号',order: 12,view: 'text', type: 'string',},
  refundableCommission: {title: '应返还佣金',order: 13,view: 'number', type: 'number',},
  actualCommission: {title: '实际返还佣金',order: 14,view: 'text', type: 'string',},
  refundableTime: {title: '返还时间',order: 15,view: 'datetime', type: 'string',},
  amount: {title: '首充金额',order: 16,view: 'number', type: 'number',},
  status: {title: '状态',order: 17,view: 'text', type: 'string',},
  cardDeliveryPerson: {title: '指定送卡人',order: 18,view: 'text', type: 'string',},
};

/**
* 流程表单调用这个方法获取formSchema
* @param param
*/
export function getBpmFormSchema(_formData): FormSchema[]{
  // 默认和原始表单保持一致 如果流程中配置了权限数据，这里需要单独处理formSchema
  return formSchema;
}

Ignore Space Show notes View src/views/customers/CardApplicationCustomersList.vue
<template> <div> <!--引用表格--> <BasicTable @register="registerTable" :rowSelection="rowSelection"> <!--插槽:table标题--> <template #tableTitle> <a-button type="primary" v-auth="'card_application_customers:add'" @click="handleAdd" preIcon="ant-design:plus-outlined"> 新增</a-button> <a-button type="primary" v-auth="'card_application_customers:exportXls'" preIcon="ant-design:export-outlined" @click="onExportXls"> 导出</a-button> <j-upload-button type="primary" v-auth="'card_application_customers:importExcel'" preIcon="ant-design:import-outlined" @click="onImportXls">导入</j-upload-button> <a-dropdown v-if="selectedRowKeys.length > 0"> <template #overlay> <a-menu> <a-menu-item key="1" @click="batchHandleDelete"> <Icon icon="ant-design:delete-outlined"></Icon> 删除 </a-menu-item> </a-menu> </template> <a-button v-auth="'card_application_customers:deleteBatch'">批量操作 <Icon icon="mdi:chevron-down"></Icon> </a-button> </a-dropdown> <!-- 高级查询 --> <super-query :config="superQueryConfig" @search="handleSuperQuery" /> </template> <!--操作栏--> <template #action="{ record }"> <TableAction :actions="getTableAction(record)" :dropDownActions="getDropDownAction(record)"/> </template> <!--字段回显插槽--> <template v-slot:bodyCell="{ column, record, index, text }"> </template> </BasicTable> <!-- 表单区域 --> <CardApplicationCustomersModal @register="registerModal" @success="handleSuccess"></CardApplicationCustomersModal> <DispatchOrderModal @register="registerModal2" @success="handleSuccess"></DispatchOrderModal> </div> </template> <script lang="ts" name="org.jeecg.modules.system-cardApplicationCustomers" setup> import {ref, reactive, computed, unref} from 'vue'; import {BasicTable, useTable, TableAction} from '/@/components/Table'; import {useModal} from '/@/components/Modal'; import { useListPage } from '/@/hooks/system/useListPage' import CardApplicationCustomersModal from './components/CardApplicationCustomersModal.vue' import DispatchOrderModal from './components/DispatchOrderModal.vue'; import {columns, searchFormSchema, superQuerySchema} from './CardApplicationCustomers.data'; import {list, deleteOne, batchDelete, getImportUrl,getExportUrl} from './CardApplicationCustomers.api'; import { downloadFile } from '/@/utils/common/renderUtils'; import { useUserStore } from '/@/store/modules/user'; import { useMessage } from '/@/hooks/web/useMessage'; import { getDateByPicker } from '/@/utils'; //日期个性化选择 const fieldPickers = reactive({ }); const queryParam = reactive<any>({}); const checkedKeys = ref<Array<string \| number>>([]); const userStore = useUserStore(); const { createMessage } = useMessage(); //注册model const [registerModal, {openModal}] = useModal(); const [registerModal2, {openModal: openModal2}] = useModal(); //注册table数据 const { prefixCls,tableContext,onExportXls,onImportXls } = useListPage({ tableProps:{ title: '办卡客户', api: list, columns, canResize:true, formConfig: { //labelWidth: 120, schemas: searchFormSchema, autoSubmitOnEnter:true, showAdvancedButton:true, fieldMapToNumber: [ ], fieldMapToTime: [ ], }, actionColumn: { width: 120, fixed:'right' }, beforeFetch: (params) => { if (params && fieldPickers) { for (let key in fieldPickers) { if (params[key]) { params[key] = getDateByPicker(params[key], fieldPickers[key]); } } } return Object.assign(params, queryParam); }, }, exportConfig: { name:"办卡客户", url: getExportUrl, params: queryParam, }, importConfig: { url: getImportUrl, success: handleSuccess }, }) const [registerTable, {reload},{ rowSelection, selectedRowKeys }] = tableContext // 高级查询配置 const superQueryConfig = reactive(superQuerySchema); /** * 高级查询事件 / function handleSuperQuery(params) { Object.keys(params).map((k) => { queryParam[k] = params[k]; }); reload(); } /* * 新增事件 / function handleAdd() { openModal(true, { isUpdate: false, showFooter: true, }); } /* * 编辑事件 / function handleEdit(record: Recordable) { openModal(true, { record, isUpdate: true, showFooter: true, }); } /* * 详情 / function handleDetail(record: Recordable) { openModal(true, { record, isUpdate: true, showFooter: false, }); } /* * 删除事件 / async function handleDelete(record) { await deleteOne({id: record.id}, handleSuccess); } /* * 批量删除事件 / async function batchHandleDelete() { await batchDelete({ids: selectedRowKeys.value}, handleSuccess); } /* * 成功回调 / function handleSuccess() { (selectedRowKeys.value = []) && reload(); } function handleDispatch(record){ if(userStore.getUserInfo?.username === 'admin'){ openModal2(true, { record, isUpdate: true, showFooter: true, }); }else{ createMessage.error('只有超级管理员才有权限派单！'); } } /* * 操作栏 / function getTableAction(record){ return [ { label: '派单', onClick: handleDispatch.bind(null, record), auth: 'card_application_customers:dispatch' } ] } /* * 下拉操作栏 / function getDropDownAction(record){ return [ { label: '详情', onClick: handleDetail.bind(null, record), }, { label: '删除', popConfirm: { title: '是否确认删除', confirm: handleDelete.bind(null, record), placement: 'topLeft', }, auth: 'card_application_customers:delete' } ] } </script> <style lang="less" scoped> :deep(.ant-picker),:deep(.ant-input-number){ width: 100%; } </style> <template> <div> <!--引用表格--> <BasicTable @register="registerTable" :rowSelection="rowSelection"> <!--插槽:table标题--> <template #tableTitle> <a-button type="primary" v-auth="'org.jeecg.modules.system:card_application_customers:add'" @click="handleAdd" preIcon="ant-design:plus-outlined"> 新增</a-button> <a-button type="primary" v-auth="'org.jeecg.modules.system:card_application_customers:exportXls'" preIcon="ant-design:export-outlined" @click="onExportXls"> 导出</a-button> <j-upload-button type="primary" v-auth="'org.jeecg.modules.system:card_application_customers:importExcel'" preIcon="ant-design:import-outlined" @click="onImportXls">导入</j-upload-button> <a-dropdown v-if="selectedRowKeys.length > 0"> <template #overlay> <a-menu> <a-menu-item key="1" @click="batchHandleDelete"> <Icon icon="ant-design:delete-outlined"></Icon> 删除 </a-menu-item> </a-menu> </template> <a-button v-auth="'org.jeecg.modules.system:card_application_customers:deleteBatch'">批量操作 <Icon icon="mdi:chevron-down"></Icon> </a-button> </a-dropdown> <!-- 高级查询 --> <super-query :config="superQueryConfig" @search="handleSuperQuery" /> </template> <!--操作栏--> <template #action="{ record }"> <TableAction :actions="getTableAction(record)" :dropDownActions="getDropDownAction(record)"/> </template> <!--字段回显插槽--> <template v-slot:bodyCell="{ column, record, index, text }"> </template> </BasicTable> <!-- 表单区域 --> <CardApplicationCustomersModal @register="registerModal" @success="handleSuccess"></CardApplicationCustomersModal> </div> </template> <script lang="ts" name="org.jeecg.modules.system-cardApplicationCustomers" setup> import {ref, reactive, computed, unref} from 'vue'; import {BasicTable, useTable, TableAction} from '/@/components/Table'; import {useModal} from '/@/components/Modal'; import { useListPage } from '/@/hooks/system/useListPage' import CardApplicationCustomersModal from './components/CardApplicationCustomersModal.vue' import {columns, searchFormSchema, superQuerySchema} from './CardApplicationCustomers.data'; import {list, deleteOne, batchDelete, getImportUrl,getExportUrl} from './CardApplicationCustomers.api'; import { downloadFile } from '/@/utils/common/renderUtils'; import { useUserStore } from '/@/store/modules/user'; import { useMessage } from '/@/hooks/web/useMessage'; import { getDateByPicker } from '/@/utils'; //日期个性化选择 const fieldPickers = reactive({ }); const queryParam = reactive<any>({}); const checkedKeys = ref<Array<string \| number>>([]); const userStore = useUserStore(); const { createMessage } = useMessage(); //注册model const [registerModal, {openModal}] = useModal(); //注册table数据 const { prefixCls,tableContext,onExportXls,onImportXls } = useListPage({ tableProps:{ title: '办卡客户', api: list, columns, canResize:true, formConfig: { //labelWidth: 120, schemas: searchFormSchema, autoSubmitOnEnter:true, showAdvancedButton:true, fieldMapToNumber: [ ], fieldMapToTime: [ ], }, actionColumn: { width: 120, fixed:'right' }, beforeFetch: (params) => { if (params && fieldPickers) { for (let key in fieldPickers) { if (params[key]) { params[key] = getDateByPicker(params[key], fieldPickers[key]); } } } return Object.assign(params, queryParam); }, }, exportConfig: { name:"办卡客户", url: getExportUrl, params: queryParam, }, importConfig: { url: getImportUrl, success: handleSuccess }, }) const [registerTable, {reload},{ rowSelection, selectedRowKeys }] = tableContext // 高级查询配置 const superQueryConfig = reactive(superQuerySchema); /* * 高级查询事件 / function handleSuperQuery(params) { Object.keys(params).map((k) => { queryParam[k] = params[k]; }); reload(); } /* * 新增事件 / function handleAdd() { openModal(true, { isUpdate: false, showFooter: true, }); } /* * 编辑事件 / function handleEdit(record: Recordable) { openModal(true, { record, isUpdate: true, showFooter: true, }); } /* * 详情 / function handleDetail(record: Recordable) { openModal(true, { record, isUpdate: true, showFooter: false, }); } /* * 删除事件 / async function handleDelete(record) { await deleteOne({id: record.id}, handleSuccess); } /* * 批量删除事件 / async function batchHandleDelete() { await batchDelete({ids: selectedRowKeys.value}, handleSuccess); } /* * 成功回调 / function handleSuccess() { (selectedRowKeys.value = []) && reload(); } /* * 操作栏 / function getTableAction(record){ return [ { label: '编辑', onClick: handleEdit.bind(null, record), auth: 'org.jeecg.modules.system:card_application_customers:edit' } ] } /* * 下拉操作栏 */ function getDropDownAction(record){ return [ { label: '详情', onClick: handleDetail.bind(null, record), }, { label: '删除', popConfirm: { title: '是否确认删除', confirm: handleDelete.bind(null, record), placement: 'topLeft', }, auth: 'org.jeecg.modules.system:card_application_customers:delete' } ] } </script> <style lang="less" scoped> :deep(.ant-picker),:deep(.ant-input-number){ width: 100%; } </style>

Ignore Space Show notes View

src/views/customers/CardApplicationCustomersList.vue

<a-dropdown v-if="selectedRowKeys.length > 0">
              <template #overlay>
                <a-menu>
                  <a-menu-item key="1" @click="batchHandleDelete">
                    <Icon icon="ant-design:delete-outlined"></Icon>
                    删除
                  </a-menu-item>
                </a-menu>
              </template>
              <a-button v-auth="'card_application_customers:deleteBatch'">批量操作
                <Icon icon="mdi:chevron-down"></Icon>
              </a-button>
        </a-dropdown>
        
        <super-query :config="superQueryConfig" @search="handleSuperQuery" />
      </template>
       
      <template #action="{ record }">
        <TableAction :actions="getTableAction(record)" :dropDownActions="getDropDownAction(record)"/>
      </template>
      
      <template v-slot:bodyCell="{ column, record, index, text }">
      </template>
    </BasicTable>
    
    <CardApplicationCustomersModal @register="registerModal" @success="handleSuccess"></CardApplicationCustomersModal>
    <DispatchOrderModal @register="registerModal2" @success="handleSuccess"></DispatchOrderModal>  
  </div>
</template>

const [registerTable, {reload},{ rowSelection, selectedRowKeys }] = tableContext

// 高级查询配置
  const superQueryConfig = reactive(superQuerySchema);

function handleDispatch(record){
    if(userStore.getUserInfo?.username === 'admin'){
        openModal2(true, {
          record,
          isUpdate: true,
          showFooter: true,
        });
    }else{
        createMessage.error('只有超级管理员才有权限派单！');
    }
  }
   /**
      * 操作栏
      */
  function getTableAction(record){
       return [
         {
           label: '派单',
           onClick: handleDispatch.bind(null, record),
           auth: 'card_application_customers:dispatch'
         }
       ]
   }
     /**
        * 下拉操作栏
        */
  function getDropDownAction(record){
       return [
         {
           label: '详情',
           onClick: handleDetail.bind(null, record),
         }, {
           label: '删除',
           popConfirm: {
             title: '是否确认删除',
             confirm: handleDelete.bind(null, record),
             placement: 'topLeft',
           },
           auth: 'card_application_customers:delete'
         }
       ]
   }

</script>

<a-dropdown v-if="selectedRowKeys.length > 0">
              <template #overlay>
                <a-menu>
                  <a-menu-item key="1" @click="batchHandleDelete">
                    <Icon icon="ant-design:delete-outlined"></Icon>
                    删除
                  </a-menu-item>
                </a-menu>
              </template>
              <a-button v-auth="'org.jeecg.modules.system:card_application_customers:deleteBatch'">批量操作
                <Icon icon="mdi:chevron-down"></Icon>
              </a-button>
        </a-dropdown>
        
        <super-query :config="superQueryConfig" @search="handleSuperQuery" />
      </template>
       
      <template #action="{ record }">
        <TableAction :actions="getTableAction(record)" :dropDownActions="getDropDownAction(record)"/>
      </template>
      
      <template v-slot:bodyCell="{ column, record, index, text }">
      </template>
    </BasicTable>
    
    <CardApplicationCustomersModal @register="registerModal" @success="handleSuccess"></CardApplicationCustomersModal>
  </div>
</template>

const [registerTable, {reload},{ rowSelection, selectedRowKeys }] = tableContext

// 高级查询配置
  const superQueryConfig = reactive(superQuerySchema);

/**
   * 高级查询事件
   */
  function handleSuperQuery(params) {
    Object.keys(params).map((k) => {
      queryParam[k] = params[k];
    });
    reload();
  }
   /**
    * 新增事件
    */
  function handleAdd() {
     openModal(true, {
       isUpdate: false,
       showFooter: true,
     });
  }
   /**
    * 编辑事件
    */
  function handleEdit(record: Recordable) {
     openModal(true, {
       record,
       isUpdate: true,
       showFooter: true,
     });
   }
   /**
    * 详情
   */
  function handleDetail(record: Recordable) {
     openModal(true, {
       record,
       isUpdate: true,
       showFooter: false,
     });
   }
   /**
    * 删除事件
    */
  async function handleDelete(record) {
     await deleteOne({id: record.id}, handleSuccess);
   }
   /**
    * 批量删除事件
    */
  async function batchHandleDelete() {
     await batchDelete({ids: selectedRowKeys.value}, handleSuccess);
   }
   /**
    * 成功回调
    */
  function handleSuccess() {
      (selectedRowKeys.value = []) && reload();
   }
   /**
      * 操作栏
      */
  function getTableAction(record){
       return [
         {
           label: '编辑',
           onClick: handleEdit.bind(null, record),
           auth: 'org.jeecg.modules.system:card_application_customers:edit'
         }
       ]
   }
     /**
        * 下拉操作栏
        */
  function getDropDownAction(record){
       return [
         {
           label: '详情',
           onClick: handleDetail.bind(null, record),
         }, {
           label: '删除',
           popConfirm: {
             title: '是否确认删除',
             confirm: handleDelete.bind(null, record),
             placement: 'topLeft',
           },
           auth: 'org.jeecg.modules.system:card_application_customers:delete'
         }
       ]
   }

</script>

Ignore Space Show notes View src/views/customers/components/CardApplicationCustomersModal.vue
<template> <BasicModal v-bind="$attrs" @register="registerModal" destroyOnClose :title="title" :width="800" @ok="handleSubmit"> <BasicForm @register="registerForm" name="CardApplicationCustomersForm" /> </BasicModal> </template> <script lang="ts" setup> import {ref, computed, unref, reactive} from 'vue'; import {BasicModal, useModalInner} from '/@/components/Modal'; import {BasicForm, useForm} from '/@/components/Form/index'; import {formSchema} from '../CardApplicationCustomers.data'; import {saveOrUpdate} from '../CardApplicationCustomers.api'; import { useMessage } from '/@/hooks/web/useMessage'; import { getDateByPicker } from '/@/utils'; const { createMessage } = useMessage(); // Emits声明 const emit = defineEmits(['register','success']); const isUpdate = ref(true); const isDetail = ref(false); //表单配置 const [registerForm, { setProps,resetFields, setFieldsValue, validate, scrollToField }] = useForm({ labelWidth: 150, schemas: formSchema, showActionButtonGroup: false, baseColProps: {span: 24} }); //表单赋值 const [registerModal, {setModalProps, closeModal}] = useModalInner(async (data) => { //重置表单 await resetFields(); setModalProps({confirmLoading: false,showCancelBtn:!!data?.showFooter,showOkBtn:!!data?.showFooter}); isUpdate.value = !!data?.isUpdate; isDetail.value = !!data?.showFooter; if (unref(isUpdate)) { //表单赋值 await setFieldsValue({ ...data.record, }); } // 隐藏底部时禁用整个表单 setProps({ disabled: !data?.showFooter }) }); //日期个性化选择 const fieldPickers = reactive({ }); //设置标题 const title = computed(() => (!unref(isUpdate) ? '新增' : !unref(isDetail) ? '详情' : '编辑')); //表单提交事件 async function handleSubmit(v) { try { let values = await validate(); // 预处理日期数据 changeDateValue(values); setModalProps({confirmLoading: true}); //提交表单 await saveOrUpdate(values, isUpdate.value); //关闭弹窗 closeModal(); //刷新列表 emit('success'); } catch ({ errorFields }) { if (errorFields) { const firstField = errorFields[0]; if (firstField) { scrollToField(firstField.name, { behavior: 'smooth', block: 'center' }); } } return Promise.reject(errorFields); } finally { setModalProps({confirmLoading: false}); } } /** * 处理日期值 * @param formData 表单数据 / const changeDateValue = (formData) => { if (formData && fieldPickers) { for (let key in fieldPickers) { if (formData[key]) { formData[key] = getDateByPicker(formData[key], fieldPickers[key]); } } } }; </script> <style lang="less" scoped> /* 时间和数字输入框样式 / :deep(.ant-input-number) { width: 100%; } :deep(.ant-calendar-picker) { width: 100%; } </style> <template> <BasicModal v-bind="$attrs" @register="registerModal" destroyOnClose :title="title" :width="800" @ok="handleSubmit"> <BasicForm @register="registerForm" name="CardApplicationCustomersForm" /> </BasicModal> </template> <script lang="ts" setup> import {ref, computed, unref, reactive} from 'vue'; import {BasicModal, useModalInner} from '/@/components/Modal'; import {BasicForm, useForm} from '/@/components/Form/index'; import {formSchema} from '../CardApplicationCustomers.data'; import {saveOrUpdate} from '../CardApplicationCustomers.api'; import { useMessage } from '/@/hooks/web/useMessage'; import { getDateByPicker } from '/@/utils'; const { createMessage } = useMessage(); // Emits声明 const emit = defineEmits(['register','success']); const isUpdate = ref(true); const isDetail = ref(false); //表单配置 const [registerForm, { setProps,resetFields, setFieldsValue, validate, scrollToField }] = useForm({ labelWidth: 150, schemas: formSchema, showActionButtonGroup: false, baseColProps: {span: 24} }); //表单赋值 const [registerModal, {setModalProps, closeModal}] = useModalInner(async (data) => { //重置表单 await resetFields(); setModalProps({confirmLoading: false,showCancelBtn:!!data?.showFooter,showOkBtn:!!data?.showFooter}); isUpdate.value = !!data?.isUpdate; isDetail.value = !!data?.showFooter; if (unref(isUpdate)) { //表单赋值 await setFieldsValue({ ...data.record, }); } // 隐藏底部时禁用整个表单 setProps({ disabled: !data?.showFooter }) }); //日期个性化选择 const fieldPickers = reactive({ }); //设置标题 const title = computed(() => (!unref(isUpdate) ? '新增' : !unref(isDetail) ? '详情' : '编辑')); //表单提交事件 async function handleSubmit(v) { try { let values = await validate(); // 预处理日期数据 changeDateValue(values); setModalProps({confirmLoading: true}); //提交表单 await saveOrUpdate(values, isUpdate.value); //关闭弹窗 closeModal(); //刷新列表 emit('success'); } catch ({ errorFields }) { if (errorFields) { const firstField = errorFields[0]; if (firstField) { scrollToField(firstField.name, { behavior: 'smooth', block: 'center' }); } } return Promise.reject(errorFields); } finally { setModalProps({confirmLoading: false}); } } /* * 处理日期值 * @param formData 表单数据 / const changeDateValue = (formData) => { if (formData && fieldPickers) { for (let key in fieldPickers) { if (formData[key]) { formData[key] = getDateByPicker(formData[key], fieldPickers[key]); } } } }; </script> <style lang="less" scoped> /* 时间和数字输入框样式 */ :deep(.ant-input-number) { width: 100%; } :deep(.ant-calendar-picker) { width: 100%; } </style>

Ignore Space Show notes View

src/views/customers/components/CardApplicationCustomersModal.vue

/**
     * 处理日期值
     * @param formData 表单数据
     */
    const changeDateValue = (formData) => {
        if (formData && fieldPickers) {
            for (let key in fieldPickers) {
                if (formData[key]) {
                    formData[key] = getDateByPicker(formData[key], fieldPickers[key]);
                }
            }
        }
    };

</script>

:deep(.ant-calendar-picker) {
    width: 100%;
  }
</style>

</script>

:deep(.ant-calendar-picker) {
    width: 100%;
  }
</style>

Ignore Space Show notes View src/views/customers/components/DispatchOrderModal.vue 0 → 100644
<template> <BasicModal v-bind="$attrs" @register="registerModal" destroyOnClose title="派单" :width="500" @ok="handleSubmit"> <a-form :model="formState" :label-col="labelCol" :wrapper-col="wrapperCol"> <a-form-item label="区域"> <JAreaLinkage v-model:value="formState.areaIds" @change="formatArea" /> </a-form-item> <a-form-item label="街道 "> <a-input v-model:value="formState.address" placeholder="请输入街道地址" /> </a-form-item> <a-form-item label=" "> <a href="javascript:;" @click="loadDeliveryList">查询这个区域的送卡人</a> </a-form-item> <a-form-item label="送卡人"> <a-select v-model:value="formData.cardDeliveryPerson" :options="deliveryList" :fieldNames="{ label: 'name', value: 'id' }" style="width: 100%" placeholder="请选择送卡人"> </a-select> </a-form-item> </a-form> </BasicModal> </template> <script lang="ts" setup> import {ref, computed, unref, reactive} from 'vue'; import type { UnwrapRef } from 'vue'; import {BasicModal, useModalInner} from '/@/components/Modal'; import {JAreaLinkage} from '/@/components/Form'; import { getAreaCardDeliveryPersonList, dispatch } from '../CardApplicationCustomers.api'; import { useMessage } from '/@/hooks/web/useMessage'; const { createMessage } = useMessage(); const labelCol = { style: { width: '150px' } }; const wrapperCol = { span: 14 }; // Emits声明 const emit = defineEmits(['register','success']); interface FormState { areaIds?: string[]; province: string; city: string; area: string; address: string; } const formState: UnwrapRef<FormState> = reactive({ areaIds: [], province: '', city: '', area: '', address: '', }); const deliveryList = ref<any[]>([]); function formatArea(value){ if(value && value.length == 3){ formState.province = value[0]; formState.city = value[1]; formState.area = value[2]; }else{ formState.province = ''; formState.city = ''; formState.area = ''; } } //表单赋值 const [registerModal, {setModalProps, closeModal}] = useModalInner(async (data) => { formData.value.id = data?.record?.id \|\| ''; setModalProps({confirmLoading: false,showCancelBtn:!!data?.showFooter,showOkBtn:!!data?.showFooter}); }); const formData = ref<any>({ id: '', cardDeliveryPerson: '' }); //表单提交事件 async function handleSubmit(v) { try { if(!formData.value.id){ createMessage.warning('无效的客户信息'); return Promise.reject('无效的客户信息'); } else if(!formData.value.cardDeliveryPerson){ createMessage.warning('请选择送卡人'); return Promise.reject('请选择送卡人'); } setModalProps({confirmLoading: true}); //提交表单 await dispatch(formData.value); //关闭弹窗 closeModal(); //刷新列表 emit('success'); } catch (error) { return Promise.reject(error); } finally { setModalProps({confirmLoading: false}); } } async function loadDeliveryList() { if(!formState.province \|\| !formState.city \|\| !formState.area){ createMessage.warning('请先选择区域'); return; } const res = await getAreaCardDeliveryPersonList(formState); if(Array.isArray(res)){ deliveryList.value = res; } else { createMessage.error(res \|\| '查询送卡人失败'); } } </script> <style lang="less" scoped> /** 时间和数字输入框样式 */ :deep(.ant-input-number) { width: 100%; } :deep(.ant-calendar-picker) { width: 100%; } </style>

Ignore Space Show notes View

src/views/customers/components/DispatchOrderModal.vue 0 → 100644

<template>
  <BasicModal v-bind="$attrs" @register="registerModal" destroyOnClose title="派单" :width="500" @ok="handleSubmit">
    <a-form :model="formState" :label-col="labelCol" :wrapper-col="wrapperCol">
        <a-form-item label="区域">
            <JAreaLinkage v-model:value="formState.areaIds" @change="formatArea" />
        </a-form-item>
        <a-form-item label="街道 ">
            <a-input v-model:value="formState.address" placeholder="请输入街道地址" />
        </a-form-item>
        <a-form-item label=" ">
            <a href="javascript:;" @click="loadDeliveryList">查询这个区域的送卡人</a>
        </a-form-item>
        <a-form-item label="送卡人">
            <a-select v-model:value="formData.cardDeliveryPerson" :options="deliveryList"
                  :fieldNames="{ label: 'name', value: 'id' }" style="width: 100%" placeholder="请选择送卡人">
            </a-select>
        </a-form-item>
    </a-form>
  </BasicModal>
</template>

const { createMessage } = useMessage();

const labelCol = { style: { width: '150px' } };
    const wrapperCol = { span: 14 };

// Emits声明
    const emit = defineEmits(['register','success']);

interface FormState {
        areaIds?: string[];
        province: string;
        city: string;
        area: string;
        address: string;
    }
    const formState: UnwrapRef<FormState> = reactive({
        areaIds: [],
        province: '',
        city: '',
        area: '',
        address: '',
    });
    const deliveryList = ref<any[]>([]);

//表单赋值
    const [registerModal, {setModalProps, closeModal}] = useModalInner(async (data) => {
        formData.value.id = data?.record?.id || '';
        setModalProps({confirmLoading: false,showCancelBtn:!!data?.showFooter,showOkBtn:!!data?.showFooter});
        
    });

async function loadDeliveryList() {
        if(!formState.province || !formState.city || !formState.area){
            createMessage.warning('请先选择区域');
            return;
        }
        const res = await getAreaCardDeliveryPersonList(formState);
        if(Array.isArray(res)){
            deliveryList.value = res;
        } else {
            createMessage.error(res || '查询送卡人失败');
        }
    }

</script>

:deep(.ant-calendar-picker) {
    width: 100%;
  }
</style>

Ignore Space Show notes View src/views/delivery/CardDeliveryPerson.data.ts
import {BasicColumn} from '/@/components/Table'; import {FormSchema} from '/@/components/Table'; import { rules} from '/@/utils/helper/validator'; import { render } from '/@/utils/common/renderUtils'; import { getWeekMonthQuarterYear } from '/@/utils'; import { on } from 'events'; //列表数据 export const columns: BasicColumn[] = [ { title: '送卡人姓名', align:"center", dataIndex: 'name' }, { title: '手机号', align:"center", dataIndex: 'phone' }, { title: '电信工号', align:"center", dataIndex: 'dxWorkNo' }, { title: '应收办卡费用', align:"center", dataIndex: 'receivableFee' }, { title: '全部办卡费用', align:"center", dataIndex: 'allFee' }, { title: '省市区', align:"center", dataIndex: 'area', }, { title: '详细地址', align:"center", dataIndex: 'address' }, { title: '状态', align:"center", dataIndex: 'status', customRender:({text}) => { return render.renderSwitch(text, [{text:'正常',value:'1'},{text:'失效',value:'0'}]) }, }, ]; //查询数据 export const searchFormSchema: FormSchema[] = [ { label: "送卡人姓名", field: 'name', component: 'Input', //colProps: {span: 6}, }, { label: "手机号", field: 'phone', component: 'Input', //colProps: {span: 6}, }, { label: "区", field: 'area', component: 'JAreaLinkage', componentProps: { saveCode: 'region', }, //colProps: {span: 6}, }, { label: "状态", field: 'status', component: 'JSwitch', componentProps:{ query:true, }, //colProps: {span: 6}, }, ]; //表单数据 export const formSchema: FormSchema[] = [ { label: '送卡人姓名', field: 'name', component: 'Input', dynamicRules: ({model,schema}) => { return [ { required: true, message: '请输入送卡人姓名!'}, ]; }, }, { label: '手机号', field: 'phone', component: 'Input', dynamicRules: ({model,schema}) => { return [ { required: true, message: '请输入手机号!'}, { pattern: /^1[3456789]\d{9}$/, message: '请输入正确的手机号码!'}, ]; }, }, { label: '电信工号', field: 'dxWorkNo', component: 'Input', }, { label: '应收办卡费用', field: 'receivableFee', component: 'InputNumber', dynamicRules: ({model,schema}) => { return [ { required: false}, { pattern: /^(([1-9][0-9])\|([0]\.\d{0,2}\|[1-9][0-9]\.\d{0,2}))$/, message: '请输入正确的金额!'}, ]; }, }, { label: '全部办卡费用', field: 'allFee', component: 'InputNumber', dynamicRules: ({model,schema}) => { return [ { required: false}, { pattern: /^(([1-9][0-9])\|([0]\.\d{0,2}\|[1-9][0-9]\.\d{0,2}))$/, message: '请输入正确的金额!'}, ]; }, }, { label: '省市区', field: 'area', component: 'JAreaLinkage', componentProps: { saveCode: 'all', showAll: true, onChange: (value) => { console.log(value); } }, }, { label: '详细地址', field: 'address', component: 'Input', }, { label: '状态', field: 'status', component: 'JSwitch', componentProps:{ options: ['1','0'], labelOptions: ['正常','失效'], checked: true, }, }, // TODO 主键隐藏字段，目前写死为ID { label: '', field: 'id', component: 'Input', show: false }, ]; // 高级查询数据 export const superQuerySchema = { name: {title: '送卡人姓名',order: 0,view: 'text', type: 'string',}, phone: {title: '手机号',order: 1,view: 'text', type: 'string',}, dxWorkNo: {title: '电信工号',order: 2,view: 'text', type: 'string',}, receivableFee: {title: '应收办卡费用',order: 3,view: 'number', type: 'number',}, allFee: {title: '全部办卡费用',order: 4,view: 'number', type: 'number',}, province: {title: '省',order: 5,view: 'pca', type: 'string',}, city: {title: '市',order: 6,view: 'pca', type: 'string',}, area: {title: '区',order: 7,view: 'pca', type: 'string',}, address: {title: '详细地址',order: 8,view: 'text', type: 'string',}, status: {title: '状态',order: 9,view: 'switch', type: 'string',}, }; /** * 流程表单调用这个方法获取formSchema * @param param / export function getBpmFormSchema(_formData): FormSchema[]{ // 默认和原始表单保持一致如果流程中配置了权限数据，这里需要单独处理formSchema return formSchema; } import {BasicColumn} from '/@/components/Table'; import {FormSchema} from '/@/components/Table'; import { rules} from '/@/utils/helper/validator'; import { render } from '/@/utils/common/renderUtils'; import { getWeekMonthQuarterYear } from '/@/utils'; import { on } from 'events'; //列表数据 export const columns: BasicColumn[] = [ { title: '送卡人姓名', align:"center", dataIndex: 'name' }, { title: '手机号', align:"center", dataIndex: 'phone' }, { title: '电信工号', align:"center", dataIndex: 'dxWorkNo' }, { title: '应收办卡费用', align:"center", dataIndex: 'receivableFee' }, { title: '全部办卡费用', align:"center", dataIndex: 'allFee' }, { title: '省市区', align:"center", dataIndex: 'area', }, { title: '详细地址', align:"center", dataIndex: 'address' }, { title: '状态', align:"center", dataIndex: 'status', customRender:({text}) => { return render.renderSwitch(text, [{text:'正常',value:'Y'},{text:'失效',value:'N'}]) }, }, ]; //查询数据 export const searchFormSchema: FormSchema[] = [ { label: "送卡人姓名", field: 'name', component: 'Input', //colProps: {span: 6}, }, { label: "手机号", field: 'phone', component: 'Input', //colProps: {span: 6}, }, { label: "区", field: 'area', component: 'JAreaLinkage', componentProps: { saveCode: 'region', }, //colProps: {span: 6}, }, { label: "状态", field: 'status', component: 'JSwitch', componentProps:{ query:true, }, //colProps: {span: 6}, }, ]; //表单数据 export const formSchema: FormSchema[] = [ { label: '送卡人姓名', field: 'name', component: 'Input', dynamicRules: ({model,schema}) => { return [ { required: true, message: '请输入送卡人姓名!'}, ]; }, }, { label: '手机号', field: 'phone', component: 'Input', dynamicRules: ({model,schema}) => { return [ { required: true, message: '请输入手机号!'}, { pattern: /^1[3456789]\d{9}$/, message: '请输入正确的手机号码!'}, ]; }, }, { label: '电信工号', field: 'dxWorkNo', component: 'Input', }, { label: '应收办卡费用', field: 'receivableFee', component: 'InputNumber', dynamicRules: ({model,schema}) => { return [ { required: false}, { pattern: /^(([1-9][0-9])\|([0]\.\d{0,2}\|[1-9][0-9]\.\d{0,2}))$/, message: '请输入正确的金额!'}, ]; }, }, { label: '全部办卡费用', field: 'allFee', component: 'InputNumber', dynamicRules: ({model,schema}) => { return [ { required: false}, { pattern: /^(([1-9][0-9])\|([0]\.\d{0,2}\|[1-9][0-9]\.\d{0,2}))$/, message: '请输入正确的金额!'}, ]; }, }, { label: '省市区', field: 'area', component: 'JAreaLinkage', componentProps: { saveCode: 'all', showAll: true, onChange: (value) => { console.log(value); } }, }, { label: '详细地址', field: 'address', component: 'Input', }, { label: '状态', field: 'status', component: 'JSwitch', componentProps:{ }, }, // TODO 主键隐藏字段，目前写死为ID { label: '', field: 'id', component: 'Input', show: false }, ]; // 高级查询数据 export const superQuerySchema = { name: {title: '送卡人姓名',order: 0,view: 'text', type: 'string',}, phone: {title: '手机号',order: 1,view: 'text', type: 'string',}, dxWorkNo: {title: '电信工号',order: 2,view: 'text', type: 'string',}, receivableFee: {title: '应收办卡费用',order: 3,view: 'number', type: 'number',}, allFee: {title: '全部办卡费用',order: 4,view: 'number', type: 'number',}, province: {title: '省',order: 5,view: 'pca', type: 'string',}, city: {title: '市',order: 6,view: 'pca', type: 'string',}, area: {title: '区',order: 7,view: 'pca', type: 'string',}, address: {title: '详细地址',order: 8,view: 'text', type: 'string',}, status: {title: '状态',order: 9,view: 'switch', type: 'string',}, }; /* * 流程表单调用这个方法获取formSchema * @param param */ export function getBpmFormSchema(_formData): FormSchema[]{ // 默认和原始表单保持一致如果流程中配置了权限数据，这里需要单独处理formSchema return formSchema; }

Ignore Space Show notes View

src/views/delivery/CardDeliveryPerson.data.ts

// 高级查询数据
export const superQuerySchema = {
  name: {title: '送卡人姓名',order: 0,view: 'text', type: 'string',},
  phone: {title: '手机号',order: 1,view: 'text', type: 'string',},
  dxWorkNo: {title: '电信工号',order: 2,view: 'text', type: 'string',},
  receivableFee: {title: '应收办卡费用',order: 3,view: 'number', type: 'number',},
  allFee: {title: '全部办卡费用',order: 4,view: 'number', type: 'number',},
  province: {title: '省',order: 5,view: 'pca', type: 'string',},
  city: {title: '市',order: 6,view: 'pca', type: 'string',},
  area: {title: '区',order: 7,view: 'pca', type: 'string',},
  address: {title: '详细地址',order: 8,view: 'text', type: 'string',},
  status: {title: '状态',order: 9,view: 'switch', type: 'string',},
};

Ignore Space Show notes View src/views/delivery/components/CardDeliveryPersonModal.vue
<template> <BasicModal v-bind="$attrs" @register="registerModal" destroyOnClose :title="title" :width="800" @ok="handleSubmit"> <BasicForm @register="registerForm" name="CardDeliveryPersonForm" /> </BasicModal> </template> <script lang="ts" setup> import {ref, computed, unref, reactive} from 'vue'; import {BasicModal, useModalInner} from '/@/components/Modal'; import {BasicForm, useForm} from '/@/components/Form/index'; import {formSchema} from '../CardDeliveryPerson.data'; import {saveOrUpdate} from '../CardDeliveryPerson.api'; import { useMessage } from '/@/hooks/web/useMessage'; import { getDateByPicker } from '/@/utils'; const { createMessage } = useMessage(); // Emits声明 const emit = defineEmits(['register','success']); const isUpdate = ref(true); const isDetail = ref(false); //表单配置 const [registerForm, { setProps,resetFields, setFieldsValue, validate, scrollToField }] = useForm({ labelWidth: 150, schemas: formSchema, showActionButtonGroup: false, baseColProps: {span: 24} }); //表单赋值 const [registerModal, {setModalProps, closeModal}] = useModalInner(async (data) => { //重置表单 await resetFields(); setModalProps({confirmLoading: false,showCancelBtn:!!data?.showFooter,showOkBtn:!!data?.showFooter}); isUpdate.value = !!data?.isUpdate; isDetail.value = !!data?.showFooter; if (unref(isUpdate)) { //表单赋值 await setFieldsValue({ ...data.record, }); } // 隐藏底部时禁用整个表单 setProps({ disabled: !data?.showFooter }) }); //日期个性化选择 const fieldPickers = reactive({ }); //设置标题 const title = computed(() => (!unref(isUpdate) ? '新增' : !unref(isDetail) ? '详情' : '编辑')); //表单提交事件 async function handleSubmit(v) { try { let values = await validate(); if(values.area) { const arr = values.area.split(','); values.province = arr[0]; values.city = arr[1]; values.area = arr[2]; } // 预处理日期数据 changeDateValue(values); setModalProps({confirmLoading: true}); //提交表单 await saveOrUpdate(values, isUpdate.value); //关闭弹窗 closeModal(); //刷新列表 emit('success'); } catch ({ errorFields }) { if (errorFields) { const firstField = errorFields[0]; if (firstField) { scrollToField(firstField.name, { behavior: 'smooth', block: 'center' }); } } return Promise.reject(errorFields); } finally { setModalProps({confirmLoading: false}); } } /** * 处理日期值 * @param formData 表单数据 / const changeDateValue = (formData) => { if (formData && fieldPickers) { for (let key in fieldPickers) { if (formData[key]) { formData[key] = getDateByPicker(formData[key], fieldPickers[key]); } } } }; </script> <style lang="less" scoped> /* 时间和数字输入框样式 / :deep(.ant-input-number) { width: 100%; } :deep(.ant-calendar-picker) { width: 100%; } </style> <template> <BasicModal v-bind="$attrs" @register="registerModal" destroyOnClose :title="title" :width="800" @ok="handleSubmit"> <BasicForm @register="registerForm" name="CardDeliveryPersonForm" /> </BasicModal> </template> <script lang="ts" setup> import {ref, computed, unref, reactive} from 'vue'; import {BasicModal, useModalInner} from '/@/components/Modal'; import {BasicForm, useForm} from '/@/components/Form/index'; import {formSchema} from '../CardDeliveryPerson.data'; import {saveOrUpdate} from '../CardDeliveryPerson.api'; import { useMessage } from '/@/hooks/web/useMessage'; import { getDateByPicker } from '/@/utils'; const { createMessage } = useMessage(); // Emits声明 const emit = defineEmits(['register','success']); const isUpdate = ref(true); const isDetail = ref(false); //表单配置 const [registerForm, { setProps,resetFields, setFieldsValue, validate, scrollToField }] = useForm({ labelWidth: 150, schemas: formSchema, showActionButtonGroup: false, baseColProps: {span: 24} }); //表单赋值 const [registerModal, {setModalProps, closeModal}] = useModalInner(async (data) => { //重置表单 await resetFields(); setModalProps({confirmLoading: false,showCancelBtn:!!data?.showFooter,showOkBtn:!!data?.showFooter}); isUpdate.value = !!data?.isUpdate; isDetail.value = !!data?.showFooter; if (unref(isUpdate)) { //表单赋值 await setFieldsValue({ ...data.record, }); } // 隐藏底部时禁用整个表单 setProps({ disabled: !data?.showFooter }) }); //日期个性化选择 const fieldPickers = reactive({ }); //设置标题 const title = computed(() => (!unref(isUpdate) ? '新增' : !unref(isDetail) ? '详情' : '编辑')); //表单提交事件 async function handleSubmit(v) { try { let values = await validate(); // 预处理日期数据 changeDateValue(values); setModalProps({confirmLoading: true}); //提交表单 await saveOrUpdate(values, isUpdate.value); //关闭弹窗 closeModal(); //刷新列表 emit('success'); } catch ({ errorFields }) { if (errorFields) { const firstField = errorFields[0]; if (firstField) { scrollToField(firstField.name, { behavior: 'smooth', block: 'center' }); } } return Promise.reject(errorFields); } finally { setModalProps({confirmLoading: false}); } } /* * 处理日期值 * @param formData 表单数据 / const changeDateValue = (formData) => { if (formData && fieldPickers) { for (let key in fieldPickers) { if (formData[key]) { formData[key] = getDateByPicker(formData[key], fieldPickers[key]); } } } }; </script> <style lang="less" scoped> /* 时间和数字输入框样式 */ :deep(.ant-input-number) { width: 100%; } :deep(.ant-calendar-picker) { width: 100%; } </style>

Ignore Space Show notes View

src/views/delivery/components/CardDeliveryPersonModal.vue

</script>

:deep(.ant-calendar-picker) {
    width: 100%;
  }
</style>

</script>

:deep(.ant-calendar-picker) {
    width: 100%;
  }
</style>

Ignore Space Show notes View src/views/refund/CommissionRefund.api.ts 0 → 100644
import {defHttp} from '/@/utils/http/axios'; import { useMessage } from "/@/hooks/web/useMessage"; const { createConfirm } = useMessage(); enum Api { list = '/system/commissionRefund/list', save='/system/commissionRefund/add', edit='/system/commissionRefund/edit', deleteOne = '/system/commissionRefund/delete', deleteBatch = '/system/commissionRefund/deleteBatch', importExcel = '/system/commissionRefund/importExcel', exportXls = '/system/commissionRefund/exportXls', updateAmount = '/system/commissionRefund/updateAmount', } /** * 导出api * @param params / export const getExportUrl = Api.exportXls; /* * 导入api / export const getImportUrl = Api.importExcel; /* * 列表接口 * @param params / export const list = (params) => defHttp.get({url: Api.list, params}); export const updateAmount = (params) => { return defHttp.post({url: Api.updateAmount, params}) } /* * 删除单个 / export const deleteOne = (params,handleSuccess) => { return defHttp.delete({url: Api.deleteOne, params}, {joinParamsToUrl: true}).then(() => { handleSuccess(); }); } /* * 批量删除 * @param params / export const batchDelete = (params, handleSuccess) => { createConfirm({ iconType: 'warning', title: '确认删除', content: '是否删除选中数据', okText: '确认', cancelText: '取消', onOk: () => { return defHttp.delete({url: Api.deleteBatch, data: params}, {joinParamsToUrl: true}).then(() => { handleSuccess(); }); } }); } /* * 保存或者更新 * @param params */ export const saveOrUpdate = (params, isUpdate) => { let url = isUpdate ? Api.edit : Api.save; return defHttp.post({url: url, params}); }

Ignore Space Show notes View

src/views/refund/CommissionRefund.api.ts 0 → 100644

import {defHttp} from '/@/utils/http/axios';
import { useMessage } from "/@/hooks/web/useMessage";

const { createConfirm } = useMessage();

enum Api {
  list = '/system/commissionRefund/list',
  save='/system/commissionRefund/add',
  edit='/system/commissionRefund/edit',
  deleteOne = '/system/commissionRefund/delete',
  deleteBatch = '/system/commissionRefund/deleteBatch',
  importExcel = '/system/commissionRefund/importExcel',
  exportXls = '/system/commissionRefund/exportXls',
  updateAmount = '/system/commissionRefund/updateAmount',
}
/**
 * 导出api
 * @param params
 */
export const getExportUrl = Api.exportXls;
/**
 * 导入api
 */
export const getImportUrl = Api.importExcel;
/**
 * 列表接口
 * @param params
 */
export const list = (params) =>
  defHttp.get({url: Api.list, params});

export const updateAmount = (params) => {
  return defHttp.post({url: Api.updateAmount, params})
}

Ignore Space Show notes View src/views/refund/CommissionRefund.data.ts 0 → 100644
import {BasicColumn} from '/@/components/Table'; import {FormSchema} from '/@/components/Table'; import { rules} from '/@/utils/helper/validator'; import { render } from '/@/utils/common/renderUtils'; import { getWeekMonthQuarterYear } from '/@/utils'; //列表数据 export const columns: BasicColumn[] = [ { title: '预约单号', align:"center", dataIndex: 'reservationNumber' }, { title: '预约时间', align:"center", dataIndex: 'reservationTime' }, { title: '办卡客户id', align:"center", dataIndex: 'cardApplicationId' }, { title: '办卡客户姓名', align:"center", dataIndex: 'cardApplicationName' }, { title: '办卡客户手机号', align:"center", dataIndex: 'cardApplicationPhone' }, { title: '办卡时间', align:"center", dataIndex: 'cardApplicationTime' }, { title: '首充金额', align:"center", dataIndex: 'amount' }, { title: '电信应返利金额', align:"center", dataIndex: 'refundableAmount' }, { title: '电信实返利金额', align:"center", dataIndex: 'actualAmount' }, { title: '送卡人id', align:"center", dataIndex: 'cardDeliveryPersonId' }, { title: '送卡人姓名', align:"center", dataIndex: 'cardDeliveryPersonName' }, { title: '送卡人手机号', align:"center", dataIndex: 'cardDeliveryPersonPhone' }, { title: '电信工号', align:"center", dataIndex: 'dxWorkNo' }, { title: '应返送卡费', align:"center", dataIndex: 'refundableCardAmount' }, { title: '实返送卡费', align:"center", dataIndex: 'actualCardAmount' }, { title: '实返送卡费时间', align:"center", dataIndex: 'cardAmountTime' }, { title: '分销人id', align:"center", dataIndex: 'distributionCustomersId' }, { title: '分销人姓名', align:"center", dataIndex: 'distributionCustomersName' }, { title: '分销人手机号', align:"center", dataIndex: 'distributionCustomersPhone' }, { title: '应返佣金', align:"center", dataIndex: 'refundableCommission' }, { title: '实返佣金', align:"center", dataIndex: 'actualCommission' }, { title: '佣金返还时间', align:"center", dataIndex: 'refundableTime' }, { title: '关联预约单id', align:"center", dataIndex: 'reservationId' }, { title: '毛利', align:"center", dataIndex: 'grossMargin' }, ]; //查询数据 export const searchFormSchema: FormSchema[] = [ { label: "办卡客户姓名", field: 'cardApplicationName', component: 'Input', //colProps: {span: 6}, }, { label: "办卡客户手机号", field: 'cardApplicationPhone', component: 'Input', //colProps: {span: 6}, }, { label: "送卡人姓名", field: 'cardDeliveryPersonName', component: 'Input', //colProps: {span: 6}, }, { label: "送卡人手机号", field: 'cardDeliveryPersonPhone', component: 'Input', //colProps: {span: 6}, }, { label: "电信工号", field: 'dxWorkNo', component: 'Input', //colProps: {span: 6}, }, { label: "分销人姓名", field: 'distributionCustomersName', component: 'Input', //colProps: {span: 6}, }, { label: "分销人手机号", field: 'distributionCustomersPhone', component: 'Input', //colProps: {span: 6}, }, ]; //表单数据 export const formSchema: FormSchema[] = [ { label: '预约单号', field: 'reservationNumber', component: 'Input', }, { label: '预约时间', field: 'reservationTime', component: 'DatePicker', componentProps: { showTime: true, valueFormat: 'YYYY-MM-DD HH:mm:ss' }, }, { label: '办卡客户id', field: 'cardApplicationId', component: 'Input', }, { label: '办卡客户姓名', field: 'cardApplicationName', component: 'Input', }, { label: '办卡客户手机号', field: 'cardApplicationPhone', component: 'Input', }, { label: '办卡时间', field: 'cardApplicationTime', component: 'DatePicker', componentProps: { showTime: true, valueFormat: 'YYYY-MM-DD HH:mm:ss' }, }, { label: '首充金额', field: 'amount', component: 'InputNumber', }, { label: '电信应返利金额', field: 'refundableAmount', component: 'InputNumber', }, { label: '电信实返利金额', field: 'actualAmount', component: 'InputNumber', }, { label: '送卡人id', field: 'cardDeliveryPersonId', component: 'Input', }, { label: '送卡人姓名', field: 'cardDeliveryPersonName', component: 'Input', }, { label: '送卡人手机号', field: 'cardDeliveryPersonPhone', component: 'Input', }, { label: '电信工号', field: 'dxWorkNo', component: 'Input', }, { label: '应返送卡费', field: 'refundableCardAmount', component: 'InputNumber', }, { label: '实返送卡费', field: 'actualCardAmount', component: 'InputNumber', }, { label: '实返送卡费时间', field: 'cardAmountTime', component: 'DatePicker', componentProps: { showTime: true, valueFormat: 'YYYY-MM-DD HH:mm:ss' }, }, { label: '分销人id', field: 'distributionCustomersId', component: 'Input', }, { label: '分销人姓名', field: 'distributionCustomersName', component: 'Input', }, { label: '分销人手机号', field: 'distributionCustomersPhone', component: 'Input', }, { label: '应返佣金', field: 'refundableCommission', component: 'InputNumber', }, { label: '实返佣金', field: 'actualCommission', component: 'InputNumber', }, { label: '佣金返还时间', field: 'refundableTime', component: 'Input', }, { label: '关联预约单id', field: 'reservationId', component: 'Input', }, { label: '毛利', field: 'grossMargin', component: 'InputNumber', }, // TODO 主键隐藏字段，目前写死为ID { label: '', field: 'id', component: 'Input', show: false }, ]; // 高级查询数据 export const superQuerySchema = { reservationNumber: {title: '预约单号',order: 0,view: 'text', type: 'string',}, reservationTime: {title: '预约时间',order: 1,view: 'datetime', type: 'string',}, cardApplicationId: {title: '办卡客户id',order: 2,view: 'text', type: 'string',}, cardApplicationName: {title: '办卡客户姓名',order: 3,view: 'text', type: 'string',}, cardApplicationPhone: {title: '办卡客户手机号',order: 4,view: 'text', type: 'string',}, cardApplicationTime: {title: '办卡时间',order: 5,view: 'datetime', type: 'string',}, amount: {title: '首充金额',order: 6,view: 'number', type: 'number',}, refundableAmount: {title: '电信应返利金额',order: 7,view: 'number', type: 'number',}, actualAmount: {title: '电信实返利金额',order: 8,view: 'number', type: 'number',}, cardDeliveryPersonId: {title: '送卡人id',order: 9,view: 'text', type: 'string',}, cardDeliveryPersonName: {title: '送卡人姓名',order: 10,view: 'text', type: 'string',}, cardDeliveryPersonPhone: {title: '送卡人手机号',order: 11,view: 'text', type: 'string',}, dxWorkNo: {title: '电信工号',order: 12,view: 'text', type: 'string',}, refundableCardAmount: {title: '应返送卡费',order: 13,view: 'number', type: 'number',}, actualCardAmount: {title: '实返送卡费',order: 14,view: 'number', type: 'number',}, cardAmountTime: {title: '实返送卡费时间',order: 15,view: 'datetime', type: 'string',}, distributionCustomersId: {title: '分销人id',order: 16,view: 'text', type: 'string',}, distributionCustomersName: {title: '分销人姓名',order: 17,view: 'text', type: 'string',}, distributionCustomersPhone: {title: '分销人手机号',order: 18,view: 'text', type: 'string',}, refundableCommission: {title: '应返佣金',order: 19,view: 'number', type: 'number',}, actualCommission: {title: '实返佣金',order: 20,view: 'number', type: 'number',}, refundableTime: {title: '佣金返还时间',order: 21,view: 'text', type: 'string',}, reservationId: {title: '关联预约单id',order: 22,view: 'text', type: 'string',}, grossMargin: {title: '毛利',order: 23,view: 'number', type: 'number',}, }; /** * 流程表单调用这个方法获取formSchema * @param param */ export function getBpmFormSchema(_formData): FormSchema[]{ // 默认和原始表单保持一致如果流程中配置了权限数据，这里需要单独处理formSchema return formSchema; }

Ignore Space Show notes View

src/views/refund/CommissionRefund.data.ts 0 → 100644

import {BasicColumn} from '/@/components/Table';
import {FormSchema} from '/@/components/Table';
import { rules} from '/@/utils/helper/validator';
import { render } from '/@/utils/common/renderUtils';
import { getWeekMonthQuarterYear } from '/@/utils';
//列表数据
export const columns: BasicColumn[] = [
   {
    title: '预约单号',
    align:"center",
    dataIndex: 'reservationNumber'
   },
   {
    title: '预约时间',
    align:"center",
    dataIndex: 'reservationTime'
   },
   {
    title: '办卡客户id',
    align:"center",
    dataIndex: 'cardApplicationId'
   },
   {
    title: '办卡客户姓名',
    align:"center",
    dataIndex: 'cardApplicationName'
   },
   {
    title: '办卡客户手机号',
    align:"center",
    dataIndex: 'cardApplicationPhone'
   },
   {
    title: '办卡时间',
    align:"center",
    dataIndex: 'cardApplicationTime'
   },
   {
    title: '首充金额',
    align:"center",
    dataIndex: 'amount'
   },
   {
    title: '电信应返利金额',
    align:"center",
    dataIndex: 'refundableAmount'
   },
   {
    title: '电信实返利金额',
    align:"center",
    dataIndex: 'actualAmount'
   },
   {
    title: '送卡人id',
    align:"center",
    dataIndex: 'cardDeliveryPersonId'
   },
   {
    title: '送卡人姓名',
    align:"center",
    dataIndex: 'cardDeliveryPersonName'
   },
   {
    title: '送卡人手机号',
    align:"center",
    dataIndex: 'cardDeliveryPersonPhone'
   },
   {
    title: '电信工号',
    align:"center",
    dataIndex: 'dxWorkNo'
   },
   {
    title: '应返送卡费',
    align:"center",
    dataIndex: 'refundableCardAmount'
   },
   {
    title: '实返送卡费',
    align:"center",
    dataIndex: 'actualCardAmount'
   },
   {
    title: '实返送卡费时间',
    align:"center",
    dataIndex: 'cardAmountTime'
   },
   {
    title: '分销人id',
    align:"center",
    dataIndex: 'distributionCustomersId'
   },
   {
    title: '分销人姓名',
    align:"center",
    dataIndex: 'distributionCustomersName'
   },
   {
    title: '分销人手机号',
    align:"center",
    dataIndex: 'distributionCustomersPhone'
   },
   {
    title: '应返佣金',
    align:"center",
    dataIndex: 'refundableCommission'
   },
   {
    title: '实返佣金',
    align:"center",
    dataIndex: 'actualCommission'
   },
   {
    title: '佣金返还时间',
    align:"center",
    dataIndex: 'refundableTime'
   },
   {
    title: '关联预约单id',
    align:"center",
    dataIndex: 'reservationId'
   },
   {
    title: '毛利',
    align:"center",
    dataIndex: 'grossMargin'
   },
];
//查询数据
export const searchFormSchema: FormSchema[] = [
	{
      label: "办卡客户姓名",
      field: 'cardApplicationName',
      component: 'Input',
      //colProps: {span: 6},
 	},
	{
      label: "办卡客户手机号",
      field: 'cardApplicationPhone',
      component: 'Input',
      //colProps: {span: 6},
 	},
	{
      label: "送卡人姓名",
      field: 'cardDeliveryPersonName',
      component: 'Input',
      //colProps: {span: 6},
 	},
	{
      label: "送卡人手机号",
      field: 'cardDeliveryPersonPhone',
      component: 'Input',
      //colProps: {span: 6},
 	},
	{
      label: "电信工号",
      field: 'dxWorkNo',
      component: 'Input',
      //colProps: {span: 6},
 	},
	{
      label: "分销人姓名",
      field: 'distributionCustomersName',
      component: 'Input',
      //colProps: {span: 6},
 	},
	{
      label: "分销人手机号",
      field: 'distributionCustomersPhone',
      component: 'Input',
      //colProps: {span: 6},
 	},
];
//表单数据
export const formSchema: FormSchema[] = [
  {
    label: '预约单号',
    field: 'reservationNumber',
    component: 'Input',
  },
  {
    label: '预约时间',
    field: 'reservationTime',
    component: 'DatePicker',
    componentProps: {
       showTime: true,
       valueFormat: 'YYYY-MM-DD HH:mm:ss'
     },
  },
  {
    label: '办卡客户id',
    field: 'cardApplicationId',
    component: 'Input',
  },
  {
    label: '办卡客户姓名',
    field: 'cardApplicationName',
    component: 'Input',
  },
  {
    label: '办卡客户手机号',
    field: 'cardApplicationPhone',
    component: 'Input',
  },
  {
    label: '办卡时间',
    field: 'cardApplicationTime',
    component: 'DatePicker',
    componentProps: {
       showTime: true,
       valueFormat: 'YYYY-MM-DD HH:mm:ss'
     },
  },
  {
    label: '首充金额',
    field: 'amount',
    component: 'InputNumber',
  },
  {
    label: '电信应返利金额',
    field: 'refundableAmount',
    component: 'InputNumber',
  },
  {
    label: '电信实返利金额',
    field: 'actualAmount',
    component: 'InputNumber',
  },
  {
    label: '送卡人id',
    field: 'cardDeliveryPersonId',
    component: 'Input',
  },
  {
    label: '送卡人姓名',
    field: 'cardDeliveryPersonName',
    component: 'Input',
  },
  {
    label: '送卡人手机号',
    field: 'cardDeliveryPersonPhone',
    component: 'Input',
  },
  {
    label: '电信工号',
    field: 'dxWorkNo',
    component: 'Input',
  },
  {
    label: '应返送卡费',
    field: 'refundableCardAmount',
    component: 'InputNumber',
  },
  {
    label: '实返送卡费',
    field: 'actualCardAmount',
    component: 'InputNumber',
  },
  {
    label: '实返送卡费时间',
    field: 'cardAmountTime',
    component: 'DatePicker',
    componentProps: {
       showTime: true,
       valueFormat: 'YYYY-MM-DD HH:mm:ss'
     },
  },
  {
    label: '分销人id',
    field: 'distributionCustomersId',
    component: 'Input',
  },
  {
    label: '分销人姓名',
    field: 'distributionCustomersName',
    component: 'Input',
  },
  {
    label: '分销人手机号',
    field: 'distributionCustomersPhone',
    component: 'Input',
  },
  {
    label: '应返佣金',
    field: 'refundableCommission',
    component: 'InputNumber',
  },
  {
    label: '实返佣金',
    field: 'actualCommission',
    component: 'InputNumber',
  },
  {
    label: '佣金返还时间',
    field: 'refundableTime',
    component: 'Input',
  },
  {
    label: '关联预约单id',
    field: 'reservationId',
    component: 'Input',
  },
  {
    label: '毛利',
    field: 'grossMargin',
    component: 'InputNumber',
  },
	// TODO 主键隐藏字段，目前写死为ID
	{
	  label: '',
	  field: 'id',
	  component: 'Input',
	  show: false
	},
];

// 高级查询数据
export const superQuerySchema = {
  reservationNumber: {title: '预约单号',order: 0,view: 'text', type: 'string',},
  reservationTime: {title: '预约时间',order: 1,view: 'datetime', type: 'string',},
  cardApplicationId: {title: '办卡客户id',order: 2,view: 'text', type: 'string',},
  cardApplicationName: {title: '办卡客户姓名',order: 3,view: 'text', type: 'string',},
  cardApplicationPhone: {title: '办卡客户手机号',order: 4,view: 'text', type: 'string',},
  cardApplicationTime: {title: '办卡时间',order: 5,view: 'datetime', type: 'string',},
  amount: {title: '首充金额',order: 6,view: 'number', type: 'number',},
  refundableAmount: {title: '电信应返利金额',order: 7,view: 'number', type: 'number',},
  actualAmount: {title: '电信实返利金额',order: 8,view: 'number', type: 'number',},
  cardDeliveryPersonId: {title: '送卡人id',order: 9,view: 'text', type: 'string',},
  cardDeliveryPersonName: {title: '送卡人姓名',order: 10,view: 'text', type: 'string',},
  cardDeliveryPersonPhone: {title: '送卡人手机号',order: 11,view: 'text', type: 'string',},
  dxWorkNo: {title: '电信工号',order: 12,view: 'text', type: 'string',},
  refundableCardAmount: {title: '应返送卡费',order: 13,view: 'number', type: 'number',},
  actualCardAmount: {title: '实返送卡费',order: 14,view: 'number', type: 'number',},
  cardAmountTime: {title: '实返送卡费时间',order: 15,view: 'datetime', type: 'string',},
  distributionCustomersId: {title: '分销人id',order: 16,view: 'text', type: 'string',},
  distributionCustomersName: {title: '分销人姓名',order: 17,view: 'text', type: 'string',},
  distributionCustomersPhone: {title: '分销人手机号',order: 18,view: 'text', type: 'string',},
  refundableCommission: {title: '应返佣金',order: 19,view: 'number', type: 'number',},
  actualCommission: {title: '实返佣金',order: 20,view: 'number', type: 'number',},
  refundableTime: {title: '佣金返还时间',order: 21,view: 'text', type: 'string',},
  reservationId: {title: '关联预约单id',order: 22,view: 'text', type: 'string',},
  grossMargin: {title: '毛利',order: 23,view: 'number', type: 'number',},
};

Ignore Space Show notes View src/views/refund/CommissionRefundList.vue 0 → 100644
<template> <div> <!--引用表格--> <BasicTable @register="registerTable" :rowSelection="rowSelection"> <!--插槽:table标题--> <template #tableTitle> <a-button type="primary" v-auth="'commission_refund:exportXls'" preIcon="ant-design:export-outlined" @click="onExportXls"> 导出</a-button> <j-upload-button type="primary" v-auth="'commission_refund:importExcel'" preIcon="ant-design:import-outlined" @click="onImportXls">导入</j-upload-button> <a-dropdown v-if="selectedRowKeys.length > 0"> <template #overlay> <a-menu> <a-menu-item key="1" @click="batchHandleDelete"> <Icon icon="ant-design:delete-outlined"></Icon> 删除 </a-menu-item> </a-menu> </template> <a-button v-auth="'commission_refund:deleteBatch'">批量操作 <Icon icon="mdi:chevron-down"></Icon> </a-button> </a-dropdown> <!-- 高级查询 --> <super-query :config="superQueryConfig" @search="handleSuperQuery" /> </template> <!--操作栏--> <template #action="{ record }"> <TableAction :actions="getTableAction(record)" :dropDownActions="getDropDownAction(record)" /> </template> <!--字段回显插槽--> <template v-slot:bodyCell="{ column, record, index, text }"> </template> </BasicTable> <a-modal v-model:visible="showRefundAmountModal" :title="refundTitle" @ok="handleRefund" :width="400"> <div class="p-4"> <a-input v-model:value="formRefund.amount" type="number" placeholder="请输入返还金额" /> </div> </a-modal> </div> </template> <script lang="ts" name="commissionRefund" setup> import { ref, reactive, computed, unref } from 'vue'; import { BasicTable, useTable, TableAction } from '/@/components/Table'; import { useModal } from '/@/components/Modal'; import { useListPage } from '/@/hooks/system/useListPage' import { columns, searchFormSchema, superQuerySchema } from './CommissionRefund.data'; import { list, deleteOne, batchDelete, getImportUrl, getExportUrl, updateAmount } from './CommissionRefund.api'; import { downloadFile } from '/@/utils/common/renderUtils'; import { useUserStore } from '/@/store/modules/user'; import { useMessage } from '/@/hooks/web/useMessage'; import { getDateByPicker } from '/@/utils'; //日期个性化选择 const fieldPickers = reactive({ }); const queryParam = reactive<any>({}); const checkedKeys = ref<Array<string \| number>>([]); const userStore = useUserStore(); const { createMessage } = useMessage(); //注册model const [registerModal, { openModal }] = useModal(); //注册table数据 const { prefixCls, tableContext, onExportXls, onImportXls } = useListPage({ tableProps: { title: '佣金返还', api: list, columns, canResize: true, formConfig: { //labelWidth: 120, schemas: searchFormSchema, autoSubmitOnEnter: true, showAdvancedButton: true, fieldMapToNumber: [ ], fieldMapToTime: [ ], }, actionColumn: { width: 280, fixed: 'right' }, beforeFetch: (params) => { if (params && fieldPickers) { for (let key in fieldPickers) { if (params[key]) { params[key] = getDateByPicker(params[key], fieldPickers[key]); } } } return Object.assign(params, queryParam); }, }, exportConfig: { name: "佣金返还", url: getExportUrl, params: queryParam, }, importConfig: { url: getImportUrl, success: handleSuccess }, }) const [registerTable, { reload }, { rowSelection, selectedRowKeys }] = tableContext // 高级查询配置 const superQueryConfig = reactive(superQuerySchema); /** * 高级查询事件 / function handleSuperQuery(params) { Object.keys(params).map((k) => { queryParam[k] = params[k]; }); reload(); } /* * 新增事件 / function handleAdd() { openModal(true, { isUpdate: false, showFooter: true, }); } /* * 编辑事件 / function handleEdit(record: Recordable) { openModal(true, { record, isUpdate: true, showFooter: true, }); } /* * 详情 / function handleDetail(record: Recordable) { openModal(true, { record, isUpdate: true, showFooter: false, }); } /* * 删除事件 / async function handleDelete(record) { await deleteOne({ id: record.id }, handleSuccess); } /* * 批量删除事件 / async function batchHandleDelete() { await batchDelete({ ids: selectedRowKeys.value }, handleSuccess); } /* * 成功回调 / function handleSuccess() { (selectedRowKeys.value = []) && reload(); } const formRefund = reactive({ id: '', operationType: '', // 0 返送卡费（给送卡人） 1 返佣金（给分销人） 2 办卡返利（给办卡人） amount: '', }); const showRefundAmountModal = ref<boolean>(false); const refundTitle = ref<string>(''); function handleRefund() { // 处理退款逻辑 updateAmount(formRefund).then(() => { // createMessage.success('操作成功'); reload(); showRefundAmountModal.value = false; }); } function openRefund(record, operationType) { const MapTitle = { '0': '返送卡费（给送卡人）', '1': '返佣金（给分销人）', '2': '办卡返利（给办卡人）' } refundTitle.value = MapTitle[operationType]; formRefund.id = record.id; formRefund.operationType = operationType showRefundAmountModal.value = true; } /* * 操作栏 / function getTableAction(record) { return [ { label: '返送卡费', onClick: openRefund.bind(null, record, '0'), }, { label: '返佣金', onClick: openRefund.bind(null, record, '1'), }, { label: '办卡返利', onClick: openRefund.bind(null, record, '2'), }, // { // label: '编辑', // onClick: handleEdit.bind(null, record), // auth: 'commission_refund:edit' // } ] } /* * 下拉操作栏 */ function getDropDownAction(record) { return [ { label: '详情', onClick: handleDetail.bind(null, record), }, { label: '删除', popConfirm: { title: '是否确认删除', confirm: handleDelete.bind(null, record), placement: 'topLeft', }, auth: 'commission_refund:delete' } ] } </script> <style lang="less" scoped> :deep(.ant-picker), :deep(.ant-input-number) { width: 100%; } </style>

Ignore Space Show notes View

src/views/refund/CommissionRefundList.vue 0 → 100644

<a-dropdown v-if="selectedRowKeys.length > 0">
          <template #overlay>
            <a-menu>
              <a-menu-item key="1" @click="batchHandleDelete">
                <Icon icon="ant-design:delete-outlined"></Icon>
                删除
              </a-menu-item>
            </a-menu>
          </template>
          <a-button v-auth="'commission_refund:deleteBatch'">批量操作
            <Icon icon="mdi:chevron-down"></Icon>
          </a-button>
        </a-dropdown>
        
        <super-query :config="superQueryConfig" @search="handleSuperQuery" />
      </template>
      
      <template #action="{ record }">
        <TableAction :actions="getTableAction(record)" :dropDownActions="getDropDownAction(record)" />
      </template>
      
      <template v-slot:bodyCell="{ column, record, index, text }">
      </template>
    </BasicTable>

<a-modal v-model:visible="showRefundAmountModal" :title="refundTitle" @ok="handleRefund" :width="400">
      <div class="p-4">
        <a-input v-model:value="formRefund.amount" type="number" placeholder="请输入返还金额" />
      </div>      
    </a-modal>
  </div>
</template>

const [registerTable, { reload }, { rowSelection, selectedRowKeys }] = tableContext

// 高级查询配置
const superQueryConfig = reactive(superQuerySchema);

//  {
    //    label: '编辑',
    //    onClick: handleEdit.bind(null, record),
    //    auth: 'commission_refund:edit'
    //  }
  ]
}
/**
   * 下拉操作栏
   */
function getDropDownAction(record) {
  return [
    {
      label: '详情',
      onClick: handleDetail.bind(null, record),
    }, {
      label: '删除',
      popConfirm: {
        title: '是否确认删除',
        confirm: handleDelete.bind(null, record),
        placement: 'topLeft',
      },
      auth: 'commission_refund:delete'
    }
  ]
}

</script>

Ignore Space Show notes View src/views/sys/basic/basicConfig.api.ts 0 → 100644
import {defHttp} from '/@/utils/http/axios'; enum Api { queryOne = '/system/basicConfig/queryOne', save='/system/basicConfig/add', edit='/system/basicConfig/edit', } /** * 列表接口 * @param params / export const queryOne = () => defHttp.get({url: Api.queryOne}); /* * 保存或者更新 * @param params */ export const saveOrUpdate = (params, isUpdate) => { let url = isUpdate ? Api.edit : Api.save; return defHttp.post({url: url, params}); }

Ignore Space Show notes View

src/views/sys/basic/basicConfig.api.ts 0 → 100644

Ignore Space Show notes View src/views/sys/basic/basicConfig.vue 0 → 100644
<template> <PageWrapper contentFullHeight> <CollapseContainer title=""> <a-form :model="formState" :label-col="labelCol" :wrapper-col="wrapperCol"> <a-form-item label="拼团时间" class="flex-row"> <a-input v-model:value="formState.groundTime" type="number" maxlength="2" size="small" class="input-num-b" />小时 </a-form-item> <a-form-item label="分销返佣金额 "> <a-input v-model:value="formState.distributionCommission" type="number" maxlength="6" size="small" class="input-num-b" />元 </a-form-item> <a-form-item label="拼团奖励配置"> <div style="margin-bottom: 10px"> 参团办卡人数小于或等于<a-input v-model:value="formState.minPeopleNumber" size="small" class="input-num-s" />人，奖励金额<a-input v-model:value="formState.minAmount" size="small" class="input-num-s" />元 </div> <div> 参团办卡人数大于或等于<a-input v-model:value="formState.maxPeopleNumber" size="small" class="input-num-s" />人，奖励金额<a-input v-model:value="formState.maxAmount" size="small" class="input-num-s" />元 </div> </a-form-item> <a-form-item :wrapper-col="{ span: 14, offset: 4 }"> <a-button style="margin-right: 10px">取消</a-button> <a-button type="primary" @click="onSubmit">保存</a-button> </a-form-item> </a-form> </CollapseContainer> </PageWrapper> </template> <script lang="ts" name="sys-basicConfig" setup> import { onMounted, reactive, toRaw } from 'vue'; import type { UnwrapRef } from 'vue'; import { PageWrapper } from '/@/components/Page'; import { CollapseContainer } from '/@/components/Container'; import { saveOrUpdate, queryOne } from './basicConfig.api'; import { useMessage } from '/@/hooks/web/useMessage'; interface FormState { id?: string; groundTime: number; distributionCommission: number; maxPeopleNumber: number; minPeopleNumber: number; minAmount: number; maxAmount: number; } const formState: UnwrapRef<FormState> = reactive({ groundTime: 0, distributionCommission: 0, maxPeopleNumber: 0, minPeopleNumber: 0, minAmount: 0, maxAmount: 0 }); const { createMessage } = useMessage(); const onSubmit = () => { console.log('submit!', toRaw(formState)); saveOrUpdate(formState, !!formState.id).then((res) => { if(typeof res === 'string'){ createMessage.error(res); return; } if (res && res.code === 200) { // 提交成功 createMessage.success('保存成功'); } createMessage.error(res.message \|\| '保存失败'); }); }; const labelCol = { style: { width: '150px' } }; const wrapperCol = { span: 14 }; onMounted(() => { queryOne().then((res) => { if (res && res.id) { Object.assign(formState, res); } }); }); </script> <style lang="less" scoped> .input-num-b { width: 150px; height: 30px; } .input-num-s { width: 50px; height: 30px; } </style>

Ignore Space Show notes View

src/views/sys/basic/basicConfig.vue 0 → 100644

<template>
    <PageWrapper contentFullHeight>
        <CollapseContainer title="">
            <a-form :model="formState" :label-col="labelCol" :wrapper-col="wrapperCol">
                <a-form-item label="拼团时间" class="flex-row">
                    <a-input v-model:value="formState.groundTime" type="number" maxlength="2" size="small" class="input-num-b" />小时
                </a-form-item>
                <a-form-item label="分销返佣金额 ">
                    <a-input v-model:value="formState.distributionCommission" type="number" maxlength="6" size="small" class="input-num-b" />元
                </a-form-item>
                <a-form-item label="拼团奖励配置">
                    <div style="margin-bottom: 10px">
                        参团办卡人数小于或等于<a-input v-model:value="formState.minPeopleNumber" size="small" class="input-num-s" />人，
                        奖励金额<a-input v-model:value="formState.minAmount" size="small" class="input-num-s" />元
                    </div>
                    <div>
                        参团办卡人数大于或等于<a-input v-model:value="formState.maxPeopleNumber" size="small" class="input-num-s" />人，
                        奖励金额<a-input v-model:value="formState.maxAmount" size="small" class="input-num-s" />元
                    </div>
                </a-form-item>
                <a-form-item :wrapper-col="{ span: 14, offset: 4 }">
                    <a-button style="margin-right: 10px">取消</a-button>
                    <a-button type="primary" @click="onSubmit">保存</a-button>
                </a-form-item>
            </a-form>
        </CollapseContainer>
    </PageWrapper>
</template>
<script lang="ts" name="sys-basicConfig" setup>
import { onMounted, reactive, toRaw } from 'vue';
import type { UnwrapRef } from 'vue';
import { PageWrapper } from '/@/components/Page';
import { CollapseContainer } from '/@/components/Container';
import { saveOrUpdate, queryOne } from './basicConfig.api';
import { useMessage } from '/@/hooks/web/useMessage';

interface FormState {
    id?: string;
    groundTime: number;
    distributionCommission: number;
    maxPeopleNumber: number;
    minPeopleNumber: number;
    minAmount: number;
    maxAmount: number;    
}
const formState: UnwrapRef<FormState> = reactive({
    groundTime: 0,
    distributionCommission: 0,
    maxPeopleNumber: 0,
    minPeopleNumber: 0,
    minAmount: 0,
    maxAmount: 0
});
const { createMessage } = useMessage();
const onSubmit = () => {
    console.log('submit!', toRaw(formState));
    saveOrUpdate(formState, !!formState.id).then((res) => {
        if(typeof res === 'string'){
            createMessage.error(res);
            return;
        }
        if (res && res.code === 200) {
            // 提交成功
            createMessage.success('保存成功');
        }
        createMessage.error(res.message || '保存失败');
    });
};
const labelCol = { style: { width: '150px' } };
const wrapperCol = { span: 14 };

onMounted(() => {
    queryOne().then((res) => {
        if (res && res.id) {
            Object.assign(formState, res);
        }
    });
});
</script>
<style lang="less" scoped>
.input-num-b {
    width: 150px;
    height: 30px;
}
.input-num-s {
    width: 50px;
    height: 30px;
}
</style>

Show line notes below