feat: init

wupengfei

2025-04-03 55dc8d799de193e682e97e5333b6baa9a0e26361

feat: init

 src/hooks/index.ts

@@ -6,4 +6,3 @@
export * from './useEvent';
export * from './useUser';
export * from './help';
export * from './insuranceClaim';

 src/hooks/insuranceClaim.ts

File was deleted

 src/router/index.ts

@@ -94,33 +94,164 @@
      rootMenu: true,
    },
  },
  // {
  //   path: '/InsuranceClaimDetail',
  //   redirect: 'noRedirect',
  //   component: Layout,
  //   hidden: false,
  //   alwaysShow: true,
  //   meta: {
  //     rank: 10001,
  //     title: '理赔',
  //     rootMenu: true,
  //     icon: 'home',
  //   },
  //   children: [
  //     {
  //       path: '/InsuranceClaimDetail/:id',
  //       name: 'InsuranceClaimDetail',
  //       hidden: true,
  //       component: () => import('@/views/InsuranceClaim/InsuranceClaimDetail.vue'),
  //       meta: {
  //         rank: 10002,
  //         title: '理赔详情',
  //         // rootMenu: true,
  //         icon: 'home',
  //       },
  //     },
  //   ],
  // },
  {
    path: '/EnterpriseInfo',
    redirect: 'noRedirect',
    component: Layout,
    hidden: false,
    alwaysShow: true,
    meta: {
      rank: 10010,
      title: '企业信息',
      rootMenu: true,
      icon: 'home',
    },
    children: [
      {
        path: '/EnterpriseInfoList',
        name: 'EnterpriseInfoList',
        hidden: false,
        alwaysShow: true,
        component: () => import('@/views/EnterpriseInfo/EnterpriseInfo.vue'),
        meta: {
          rank: 10011,
          title: '企业信息',
          // rootMenu: true,
          icon: 'home',
        },
      },
      {
        path: '/EnterpriseInfoDetail/:id',
        name: 'EnterpriseInfoDetail',
        hidden: true,
        component: () => import('@/views/EnterpriseInfo/EnterpriseInfoDetail.vue'),
        meta: {
          rank: 10012,
          title: '企业信息详情',
          // rootMenu: true,
          icon: 'home',
        },
      },
    ],
  },
  {
    path: '/MaterialReview',
    redirect: 'noRedirect',
    component: Layout,
    hidden: false,
    alwaysShow: true,
    meta: {
      rank: 10020,
      title: '材料审核',
      rootMenu: true,
      icon: 'home',
    },
    children: [
      {
        path: '/MaterialReviewList',
        name: 'MaterialReviewList',
        hidden: false,
        alwaysShow: true,
        component: () => import('@/views/MaterialReview/MaterialReview.vue'),
        meta: {
          rank: 10021,
          title: '材料审核',
          // rootMenu: true,
          icon: 'home',
        },
      },
      {
        path: '/MaterialReviewDetail/:id',
        name: 'MaterialReviewDetail',
        hidden: true,
        component: () => import('@/views/MaterialReview/MaterialReviewDetail.vue'),
        meta: {
          rank: 10022,
          title: '材料审核详情',
          rootMenu: false,
        },
      },
      {
        path: '/MaterialReviewAudit/:id',
        name: 'MaterialReviewAudit',
        hidden: true,
        component: () => import('@/views/MaterialReview/MaterialReviewAudit.vue'),
        meta: {
          rank: 10023,
          title: '审核',
          rootMenu: false,
        },
      },
    ],
  },
  {
    path: '/Reward',
    redirect: 'noRedirect',
    component: Layout,
    hidden: false,
    alwaysShow: true,
    meta: {
      rank: 10030,
      title: '奖励金',
      rootMenu: true,
      icon: 'home',
    },
    children: [
      {
        path: '/RewardList',
        name: 'RewardList',
        hidden: false,
        alwaysShow: true,
        component: () => import('@/views/Reward/Reward.vue'),
        meta: {
          rank: 10031,
          title: '奖励金发放',
          // rootMenu: true,
          icon: 'home',
        },
      },
      {
        path: '/RewardDeclareDetail/:id',
        name: 'RewardDeclareDetail',
        hidden: true,
        component: () => import('@/views/Reward/RewardDeclareDetail.vue'),
        meta: {
          rank: 10032,
          title: '申报详情',
          rootMenu: false,
        },
      },
    ],
  },
  {
    path: '/Syatem',
    redirect: 'noRedirect',
    component: Layout,
    hidden: false,
    alwaysShow: true,
    meta: {
      rank: 10030,
      title: '系统配置',
      rootMenu: true,
      icon: 'home',
    },
    children: [
      {
        path: '/Account',
        name: 'Account',
        hidden: false,
        alwaysShow: true,
        component: () => import('@/views/Account/AccountManageList.vue'),
        meta: {
          rank: 10031,
          title: '账号管理',
          // rootMenu: true,
          icon: 'home',
        },
      },
    ],
  },

  {
    path: '/Login',
    name: 'Login',

 src/store/modules/permission.ts

@@ -33,7 +33,7 @@
          const res = await baseModuleServices.getCurrentUserModuleList({
            showLoading: false,
          });
          const accessedRoutes = ascending(addAsyncRoutes(formatModuleList(res, null))); // createAccessedRoutes(userMenuList, userInfo)
          const accessedRoutes = ascending(addAsyncRoutes(formatModuleList([], null))); // createAccessedRoutes(userMenuList, userInfo)
          //@ts-ignore
          accessedRoutes.push({ path: '/:pathMatch(.*)*', redirect: '/404', hidden: true });


 src/store/modules/user.ts

@@ -4,7 +4,6 @@
import { resetRouter, router } from '@/router';
import { useTagsViewStoreHook } from './tagsView';
import * as accountServices from '@/services/api/Account';
import * as userServices from '@/services/api/User';
import { usePermissionStoreHook } from './permission';
import { getAccountInfoFromAccessToken, AccountInfo } from '@bole-core/core';
import { useClearSubModule } from '@/hooks';
@@ -64,7 +63,7 @@
    // 用户登入
    loginByUsername(data: API.AccessRequestDto) {
      return new Promise<void>((resolve, reject) => {
        userServices
        accountServices
          .getTokenForWeb(data, { showLoading: false })
          .then((res) => {
            if (res) {

 src/views/Account/AccountManageList.vue

@@ -14,13 +14,7 @@
          </QueryFilterItem>
        </template>
        <template #btn>
          <el-button
            v-if="checkSubModuleItemShow('pageButton', 'addBtn')"
            @click="openDialog()"
            icon="Plus"
            type="primary"
            >新增</el-button
          >
          <el-button @click="openDialog()" icon="Plus" type="primary">新增</el-button>
        </template>
      </ProTableQueryFilterBar>
      <ProTableV2 v-bind="proTableProps" :columns="column" :operationBtns="operationBtns">
@@ -33,7 +27,6 @@
<script setup lang="ts">
import {
  ProTableQueryFilterBar,
  OperationBtnType,
  ProTableV2,
  SearchInput,
  LoadingLayout,
@@ -41,10 +34,9 @@
  QueryFilterItem,
  useTable,
  useFormDialog,
  defineOperationBtns,
} from '@bole-core/components';
import { useAccess } from '@/hooks';
import * as userServices from '@/services/api/User';
import { RoleClientType } from '@/constants';
import * as accountServices from '@/services/api/Account';
import { Message, OrderInputType } from '@bole-core/core';
import AddOrEditAccountDialog from './components/AddOrEditAccountDialog.vue';
import { formatRoleName } from '@/utils';
@@ -53,13 +45,49 @@
  name: 'AccountManageList',
});

const operationBtnMap: Record<string, OperationBtnType> = {
  editBtn: { emits: { onClick: (role) => openDialog(role) } },
};
const column: API.CustomModuleColumnDto[] = [
  {
    id: '1',
    enCode: 'changeFlag',
    name: '账号',
  },
  {
    id: '2',
    enCode: 'name',
    name: '姓名',
  },
  {
    id: '3',
    enCode: 'idNumber',
    name: '手机号',
  },
  {
    id: '4',
    enCode: 'workType',
    name: '备注',
  },
];

const { checkSubModuleItemShow, column, operationBtns } = useAccess({
  operationBtnMap,
});
const operationBtns = defineOperationBtns([
  {
    data: {
      enCode: 'editBtn',
      name: '编辑',
    },
    emits: {
      onClick: (role) => openDialog(role),
    },
  },
  {
    data: {
      enCode: 'resetPasswordBtn',
      name: '重置密码',
    },
    emits: {
      onClick: (role) => handleResetPassword(),
    },
  },
]);

const BaseState = {
  loading: true,
@@ -80,35 +108,31 @@
  reset,
} = useTable(
  async ({ pageIndex, pageSize }, extraParamState) => {
    try {
      let params: API.QueryUserPageInput = {
        pageModel: {
          rows: pageSize,
          page: pageIndex,
          orderInput: extraParamState.orderInput,
        },
        searchKey: extraParamState.keyword,
      };
      let res = await userServices.getUserPage(params, {
        showLoading: !state.loading,
      });
      return res;
    } catch (error) {}
    // try {
    //   let params: API.QueryUserPageInput = {
    //     pageModel: {
    //       rows: pageSize,
    //       page: pageIndex,
    //       orderInput: extraParamState.orderInput,
    //     },
    //     searchKey: extraParamState.keyword,
    //   };
    //   let res = await userServices.getUserPage(params, {
    //     showLoading: !state.loading,
    //   });
    //   return res;
    // } catch (error) {}
  },
  {
    defaultExtraParams: {
      orderInput: [{ property: 'id', order: OrderInputType.Desc }],
      keyword: '',
    },
    columnsRenderProps: {
      roleNames: {
        formatter: (row: API.UserListOutput) => row.roleNames.map(formatRoleName).join(','),
      },
    },
    columnsRenderProps: {},
  }
);

function openDialog(row?: API.UserListOutput) {
function openDialog(row?: any) {
  if (row) {
    handleEdit({
      id: row.id,
@@ -148,29 +172,31 @@
});

async function handleAddOrEdit() {
  try {
    let isEdit = !!editForm.id;
    let params: API.CreateAccountInput = {
      name: editForm.name,
      userName: editForm.userName,
      remark: editForm.remark,
      password: editForm.password,
      phoneNumber: editForm.phoneNumber,
      channel: editForm.channel,
      // clientId: RoleClientType.RoleBackendClientId,
      roleNames: [editForm.roleName],
    };
    let res;
    if (isEdit) {
      (params as API.UpdateAccountInput).id = editForm.id;
      res = await userServices.updateAccount(params);
    } else {
      res = await userServices.createAccount(params);
    }
    if (res) {
      Message.successMessage('操作成功');
      getList(isEdit ? paginationState.pageIndex : 1);
    }
  } catch (error) {}
  // try {
  //   let isEdit = !!editForm.id;
  //   let params: API.CreateAccountInput = {
  //     name: editForm.name,
  //     userName: editForm.userName,
  //     remark: editForm.remark,
  //     password: editForm.password,
  //     phoneNumber: editForm.phoneNumber,
  //     channel: editForm.channel,
  //     // clientId: RoleClientType.RoleBackendClientId,
  //     roleNames: [editForm.roleName],
  //   };
  //   let res;
  //   if (isEdit) {
  //     (params as API.UpdateAccountInput).id = editForm.id;
  //     res = await accountServices.updateAccount(params);
  //   } else {
  //     res = await accountServices.createAccount(params);
  //   }
  //   if (res) {
  //     Message.successMessage('操作成功');
  //     getList(isEdit ? paginationState.pageIndex : 1);
  //   }
  // } catch (error) {}
}

function handleResetPassword() {}
</script>

 src/views/Account/components/AddOrEditAccountDialog.vue

@@ -29,13 +29,6 @@
      >
        <ProFormText placeholder="请输入手机号" v-model.trim="form.phoneNumber"></ProFormText>
      </ProFormItemV2>
      <ProFormItemV2 label="渠道:" prop="channel" :check-rules="[{ message: '请输入渠道' }]">
        <ProFormText
          placeholder="请输入渠道"
          v-model.trim="form.channel"
          :maxlength="30"
        ></ProFormText>
      </ProFormItemV2>
      <ProFormItemV2
        label="密码:"
        prop="password"
@@ -46,16 +39,6 @@
          v-model.trim="form.password"
          :maxlength="30"
        ></ProFormText>
      </ProFormItemV2>
      <ProFormItemV2 label="角色:" prop="roleName" :check-rules="[{ message: '请选择角色' }]">
        <ProFormRadio
          v-model.trim="form.roleName"
          :value-enum="allRoleList"
          :button-style="false"
          enum-label-key="name"
          enum-value-key="realName"
          :disabled="!!form.id"
        />
      </ProFormItemV2>

      <ProFormItemV2 label="备注:" prop="remark">
@@ -87,7 +70,6 @@
  ProFormCheckbox,
} from '@bole-core/components';
import { BooleanOptions } from '@/constants';
import { useAllRoleList } from '@/hooks';

defineOptions({
  name: 'AddOrEditAccountDialog',
@@ -122,8 +104,6 @@
}>();

const dialogForm = ref<FormInstance>();

const { allRoleList } = useAllRoleList();

function onDialogClose() {
  if (!dialogForm.value) return;

 src/views/EnterpriseInfo/EnterpriseInfo.vue

New file
@@ -0,0 +1,195 @@
<template>
  <LoadingLayout :loading="state.loading">
    <AppContainer>
      <ProTableQueryFilterBar @on-reset="reset">
        <template #query>
          <QueryFilterItem tip-content="最近申报日期">
            <FieldDatePicker
              v-model="extraParamState.date"
              type="daterange"
              range-separator="~"
              start-placeholder="开始日期"
              end-placeholder="结束日期"
              clearable
              @change="getList()"
            ></FieldDatePicker>
          </QueryFilterItem>
          <QueryFilterItem tip-content="最近发放日期">
            <FieldDatePicker
              v-model="extraParamState.date"
              type="daterange"
              range-separator="~"
              start-placeholder="开始日期"
              end-placeholder="结束日期"
              clearable
              @change="getList()"
            ></FieldDatePicker>
          </QueryFilterItem>
          <QueryFilterItem>
            <SearchInput
              v-model="extraParamState.keyword"
              style="width: 300px"
              placeholder="企业名/统一信用代码"
              @on-click-search="getList"
            >
            </SearchInput>
          </QueryFilterItem>
        </template>
      </ProTableQueryFilterBar>

      <ProTableV2 v-bind="proTableProps" :columns="column" :operationBtns="operationBtns">
      </ProTableV2>
    </AppContainer>
  </LoadingLayout>
</template>

<script setup lang="ts">
import {
  LoadingLayout,
  AppContainer,
  useTable,
  ProTableQueryFilterBar,
  ProTableV2,
  defineOperationBtns,
  SearchInput,
  QueryFilterItem,
  FieldDatePicker,
} from '@bole-core/components';
import { OrderInputType } from '@bole-core/core';
import { format } from '@/utils';
import * as informationServices from '@/services/api/Information';
import _ from 'lodash';
import { ModelValueType } from 'element-plus';

defineOptions({
  name: 'EnterpriseInfo',
});

const column: API.CustomModuleColumnDto[] = [
  {
    id: '1',
    enCode: 'changeFlag',
    name: '企业名',
  },
  {
    id: '2',
    enCode: 'name',
    name: '统一社会信用代码',
  },
  {
    id: '3',
    enCode: 'idNumber',
    name: '企业类型',
  },
  {
    id: '4',
    enCode: 'workType',
    name: '所属园区',
  },
  {
    id: '5',
    enCode: 'gender',
    name: '园区类型',
  },
  {
    id: '6',
    enCode: 'age',
    name: '奖励金申报次数',
  },
  {
    id: '7',
    enCode: 'birthDay',
    name: '最近申报日期',
  },
  {
    id: '8',
    enCode: 'phoneNumber',
    name: '奖励金发放次数',
  },
  {
    id: '9',
    enCode: 'phoneNumber',
    name: '最近发放日期',
  },
  {
    id: '10',
    enCode: 'phoneNumber',
    name: '奖励金发放总额',
  },
  {
    id: '11',
    enCode: 'phoneNumber',
    name: '奖励金余额',
  },
];

const operationBtns = defineOperationBtns([
  {
    data: {
      enCode: 'detailBtn',
      name: '详情',
    },
    emits: {
      onClick: (role) => goDetail(role),
    },
  },
]);

const router = useRouter();
const BaseState = {
  loading: true,
};

const state = reactive({ ...BaseState });

onMounted(async () => {
  await getList();
  state.loading = false;
});

const {
  getDataSource: getList,
  proTableProps,
  paginationState,
  extraParamState,
  reset,
} = useTable(
  async ({ pageIndex, pageSize }, extraParamState) => {
    try {
      let params: API.GetInformationForManageInput = {
        pageModel: {
          rows: pageSize,
          page: pageIndex,
          orderInput: extraParamState.orderInput,
        },
        publishStartDate: format(extraParamState.date?.[0] ?? '', 'YYYY-MM-DD 00:00:00'),
        publishEndDate: format(extraParamState.date?.[1] ?? '', 'YYYY-MM-DD 23:59:59'),
      };
      let res = await informationServices.getInformationForManage(params, {
        showLoading: !state.loading,
      });
      return res;
    } catch (error) {}
  },
  {
    defaultExtraParams: {
      keyword: '',
      date: [] as unknown as ModelValueType,
      orderInput: [{ property: 'creationTime', order: OrderInputType.Desc }],
    },
  }
);

function goDetail(row: any) {
  router.push({
    name: 'EnterpriseInfoDetail',
    params: {
      id: row.id,
    },
  });
}
</script>

<style lang="scss" scoped>
@use '@/style/common.scss' as *;
</style>

 src/views/EnterpriseInfo/EnterpriseInfoDetail.vue

New file
@@ -0,0 +1,13 @@
<template>
  <div>EnterpriseInfoDetail</div>
</template>

<script setup lang="ts">
defineOptions({
  name: 'EnterpriseInfoDetail',
});
</script>

<style lang="scss" scoped>
@use '@/style/common.scss' as *;
</style>

 src/views/MaterialReview/MaterialReview.vue

New file
@@ -0,0 +1,209 @@
<template>
  <LoadingLayout :loading="state.loading">
    <AppContainer>
      <ProTableQueryFilterBar @on-reset="reset">
        <template #query>
          <QueryFilterItem tip-content="最近申报日期">
            <FieldDatePicker
              v-model="extraParamState.date"
              type="daterange"
              range-separator="~"
              start-placeholder="开始日期"
              end-placeholder="结束日期"
              clearable
              @change="getList()"
            ></FieldDatePicker>
          </QueryFilterItem>
          <QueryFilterItem tip-content="最近发放日期">
            <FieldDatePicker
              v-model="extraParamState.date"
              type="daterange"
              range-separator="~"
              start-placeholder="开始日期"
              end-placeholder="结束日期"
              clearable
              @change="getList()"
            ></FieldDatePicker>
          </QueryFilterItem>
          <QueryFilterItem>
            <FieldRadio
              v-model="extraParamState.showStatus"
              :value-enum="DataRangeEnumText"
              buttonStyle
              showAllBtn
              @change="getList()"
            />
          </QueryFilterItem>
          <QueryFilterItem>
            <SearchInput
              v-model="extraParamState.keyword"
              style="width: 200px"
              placeholder="批次号"
              @on-click-search="getList"
            >
            </SearchInput>
          </QueryFilterItem>
        </template>
      </ProTableQueryFilterBar>

      <ProTableV2 v-bind="proTableProps" :columns="column" :operationBtns="operationBtns">
      </ProTableV2>
    </AppContainer>
  </LoadingLayout>
</template>

<script setup lang="ts">
import {
  LoadingLayout,
  AppContainer,
  useTable,
  ProTableQueryFilterBar,
  ProTableV2,
  defineOperationBtns,
  SearchInput,
  FieldRadio,
  QueryFilterItem,
  FieldDatePicker,
} from '@bole-core/components';
import { OrderInputType } from '@bole-core/core';
import { format } from '@/utils';
import { DataRangeEnum, DataRangeEnumText } from '@/constants';
import * as informationServices from '@/services/api/Information';
import _ from 'lodash';
import { ModelValueType } from 'element-plus';

defineOptions({
  name: 'MaterialReview',
});

const column: API.CustomModuleColumnDto[] = [
  {
    id: '1',
    enCode: 'changeFlag',
    name: '申请批次号',
  },
  {
    id: '2',
    enCode: 'name',
    name: '申请园区',
  },
  {
    id: '3',
    enCode: 'idNumber',
    name: '园区类型',
  },
  {
    id: '4',
    enCode: 'workType',
    name: '申请奖励金月份',
  },
  {
    id: '5',
    enCode: 'gender',
    name: '奖励金汇总金额（元）',
  },
  {
    id: '6',
    enCode: 'age',
    name: '申报日期',
  },
  {
    id: '7',
    enCode: 'birthDay',
    name: '审核日期',
  },
  {
    id: '8',
    enCode: 'phoneNumber',
    name: '审核状态',
  },
];

const operationBtns = defineOperationBtns([
  {
    data: {
      enCode: 'detailBtn',
      name: '详情',
    },
    emits: {
      onClick: (role) => goDetail(role),
    },
  },
  {
    data: {
      enCode: 'auditBtn',
      name: '审核',
    },
    emits: {
      onClick: (role) => goAudit(role),
    },
  },
]);

const router = useRouter();
const BaseState = {
  loading: true,
};

const state = reactive({ ...BaseState });

onMounted(async () => {
  await getList();
  state.loading = false;
});

const {
  getDataSource: getList,
  proTableProps,
  paginationState,
  extraParamState,
  reset,
} = useTable(
  async ({ pageIndex, pageSize }, extraParamState) => {
    try {
      let params: API.GetInformationForManageInput = {
        pageModel: {
          rows: pageSize,
          page: pageIndex,
          orderInput: extraParamState.orderInput,
        },
        publishStartDate: format(extraParamState.date?.[0] ?? '', 'YYYY-MM-DD 00:00:00'),
        publishEndDate: format(extraParamState.date?.[1] ?? '', 'YYYY-MM-DD 23:59:59'),
      };
      let res = await informationServices.getInformationForManage(params, {
        showLoading: !state.loading,
      });
      return res;
    } catch (error) {}
  },
  {
    defaultExtraParams: {
      keyword: '',
      showStatus: '' as any as DataRangeEnum,
      date: [] as unknown as ModelValueType,
      orderInput: [{ property: 'creationTime', order: OrderInputType.Desc }],
    },
  }
);

function goDetail(row: any) {
  router.push({
    name: 'MaterialReviewDetail',
    params: {
      id: row.id,
    },
  });
}
function goAudit(row: any) {
  router.push({
    name: 'MaterialReviewAudit',
    params: {
      id: row.id,
    },
  });
}
</script>

<style lang="scss" scoped>
@use '@/style/common.scss' as *;
</style>

 src/views/MaterialReview/MaterialReviewAudit.vue

New file
@@ -0,0 +1,13 @@
<template>
  <div>MaterialReviewAudit</div>
</template>

<script setup lang="ts">
defineOptions({
  name: 'MaterialReviewAudit',
});
</script>

<style lang="scss" scoped>
@use '@/style/common.scss' as *;
</style>

 src/views/MaterialReview/MaterialReviewDetail.vue

New file
@@ -0,0 +1,13 @@
<template>
  <div>MaterialReviewDetail</div>
</template>

<script setup lang="ts">
defineOptions({
  name: 'MaterialReviewDetail',
});
</script>

<style lang="scss" scoped>
@use '@/style/common.scss' as *;
</style>

 src/views/Reward/Reward.vue

New file
@@ -0,0 +1,231 @@
<template>
  <LoadingLayout :loading="state.loading">
    <AppContainer>
      <ProTableQueryFilterBar @on-reset="reset">
        <template #query>
          <QueryFilterItem tip-content="最近申报日期">
            <FieldDatePicker
              v-model="extraParamState.date"
              type="daterange"
              range-separator="~"
              start-placeholder="开始日期"
              end-placeholder="结束日期"
              clearable
              @change="getList()"
            ></FieldDatePicker>
          </QueryFilterItem>
          <QueryFilterItem tip-content="最近发放日期">
            <FieldDatePicker
              v-model="extraParamState.date"
              type="daterange"
              range-separator="~"
              start-placeholder="开始日期"
              end-placeholder="结束日期"
              clearable
              @change="getList()"
            ></FieldDatePicker>
          </QueryFilterItem>
          <QueryFilterItem>
            <FieldRadio
              v-model="extraParamState.showStatus"
              :value-enum="DataRangeEnumText"
              buttonStyle
              showAllBtn
              @change="getList()"
            />
          </QueryFilterItem>
          <QueryFilterItem>
            <SearchInput
              v-model="extraParamState.keyword"
              style="width: 200px"
              placeholder="批次号"
              @on-click-search="getList"
            >
            </SearchInput>
          </QueryFilterItem>
        </template>
      </ProTableQueryFilterBar>

      <ProTableV2 v-bind="proTableProps" :columns="column" :operationBtns="operationBtns">
      </ProTableV2>

      <RewardGrantDialog v-bind="dialogProps"></RewardGrantDialog>
    </AppContainer>
  </LoadingLayout>
</template>

<script setup lang="ts">
import {
  LoadingLayout,
  AppContainer,
  useTable,
  ProTableQueryFilterBar,
  ProTableV2,
  defineOperationBtns,
  SearchInput,
  FieldRadio,
  QueryFilterItem,
  FieldDatePicker,
  useFormDialog,
  UploadUserFile,
} from '@bole-core/components';
import { OrderInputType } from '@bole-core/core';
import { convertApi2FormUrlOnlyOne, format } from '@/utils';
import { DataRangeEnum, DataRangeEnumText } from '@/constants';
import * as informationServices from '@/services/api/Information';
import RewardGrantDialog from './components/RewardGrantDialog.vue';
import _ from 'lodash';
import { ModelValueType } from 'element-plus';

defineOptions({
  name: 'Reward',
});

const column: API.CustomModuleColumnDto[] = [
  {
    id: '1',
    enCode: 'changeFlag',
    name: '申请批次号',
  },
  {
    id: '2',
    enCode: 'name',
    name: '申请园区',
  },
  {
    id: '3',
    enCode: 'idNumber',
    name: '园区类型',
  },
  {
    id: '4',
    enCode: 'workType',
    name: '申请奖励金月份',
  },
  {
    id: '5',
    enCode: 'gender',
    name: '奖励金汇总金额（元）',
  },
  {
    id: '6',
    enCode: 'age',
    name: '申报日期',
  },
  {
    id: '7',
    enCode: 'phoneNumber',
    name: '发放状态',
  },
  {
    id: '8',
    enCode: 'phoneNumber',
    name: '发放日期',
  },
];

const operationBtns = defineOperationBtns([
  {
    data: {
      enCode: 'detailBtn',
      name: '申报详情',
    },
    emits: {
      onClick: (role) => goDetail(role),
    },
  },
  {
    data: {
      enCode: 'grantBtn',
      name: '发放',
    },
    emits: {
      onClick: (role) => openDialog(role),
    },
  },
  {
    data: {
      enCode: 'previewBtn',
      name: '查看凭证',
    },
    emits: {
      onClick: (role) => handlePreview(role),
    },
  },
]);

const router = useRouter();
const BaseState = {
  loading: true,
};

const state = reactive({ ...BaseState });

onMounted(async () => {
  await getList();
  state.loading = false;
});

const {
  getDataSource: getList,
  proTableProps,
  paginationState,
  extraParamState,
  reset,
} = useTable(
  async ({ pageIndex, pageSize }, extraParamState) => {
    try {
      let params: API.GetInformationForManageInput = {
        pageModel: {
          rows: pageSize,
          page: pageIndex,
          orderInput: extraParamState.orderInput,
        },
        publishStartDate: format(extraParamState.date?.[0] ?? '', 'YYYY-MM-DD 00:00:00'),
        publishEndDate: format(extraParamState.date?.[1] ?? '', 'YYYY-MM-DD 23:59:59'),
      };
      let res = await informationServices.getInformationForManage(params, {
        showLoading: !state.loading,
      });
      return res;
    } catch (error) {}
  },
  {
    defaultExtraParams: {
      keyword: '',
      showStatus: '' as any as DataRangeEnum,
      date: [] as unknown as ModelValueType,
      orderInput: [{ property: 'creationTime', order: OrderInputType.Desc }],
    },
  }
);

function goDetail(row: any) {
  router.push({
    name: 'RewardDeclareDetail',
    params: {
      id: row.id,
    },
  });
}

const { dialogProps, handleAdd, handleEdit, editForm } = useFormDialog({
  defaultFormParams: {
    id: '',
    url: [] as UploadUserFile[],
  },
});

function openDialog(row?: API.IncentivePaymentsManageListOutput) {
  handleEdit({
    id: row.enterpriseName,
    url: convertApi2FormUrlOnlyOne(row.issueVouchersUrl),
  });
}

function handlePreview(row?: API.IncentivePaymentsManageListOutput) {}
</script>

<style lang="scss" scoped>
@use '@/style/common.scss' as *;
</style>

 src/views/Reward/RewardDeclareDetail.vue

New file
@@ -0,0 +1,13 @@
<template>
  <div>RewardDeclareDetail</div>
</template>

<script setup lang="ts">
defineOptions({
  name: 'RewardDeclareDetail',
});
</script>

<style lang="scss" scoped>
@use '@/style/common.scss' as *;
</style>

 src/views/Reward/components/RewardGrantDialog.vue

New file
@@ -0,0 +1,105 @@
<template>
  <ProDialog
    title="奖励金发放"
    v-model="innerVisible"
    destroy-on-close
    draggable
    bodyNoPaddingBottom
    @close="onDialogClose"
    width="600px"
  >
    <ProForm :model="innerForm" ref="dialogForm" label-width="120px">
      <ProFormItemV2
        label="上传发放凭证:"
        prop="url"
        :check-rules="[{ message: '请上传发放凭证', type: 'upload' }]"
      >
        <ProFormUpload
          v-model:file-url="innerForm.url"
          :limit="1"
          :limitFileSize="10"
          accept="doc,docx,pdf"
        >
        </ProFormUpload>
      </ProFormItemV2>
    </ProForm>
    <template #footer>
      <span class="dialog-footer">
        <el-button @click="emit('onCancel')"> 取消 </el-button>
        <el-button type="primary" @click="handleConfirm">确定</el-button>
      </span>
    </template>
  </ProDialog>
</template>

<script setup lang="ts">
import {
  ProDialog,
  UploadUserFile,
  ProForm,
  ProFormItemV2,
  ProFormSelect,
  ProFormInputNumber,
  ProFormUpload,
} from '@bole-core/components';
import { FormInstance } from 'element-plus';

defineOptions({
  name: 'RewardGrantDialog',
});

type Props = {
  modelValue: boolean;
  form?: {
    id: string;
    url: UploadUserFile[];
  };
};

const props = withDefaults(defineProps<Props>(), {
  modelValue: false,
});

const emit = defineEmits<{
  (e: 'update:modelValue', value: boolean): void;
  (e: 'update:form', value: Props['form']): void;
  (e: 'onConfirm'): void;
  (e: 'onCancel'): void;
}>();

const innerVisible = computed({
  get() {
    return props.modelValue;
  },
  set(val) {
    emit('update:modelValue', val);
  },
});

const innerForm = computed({
  get() {
    return props.form;
  },
  set(val) {
    emit('update:form', val);
  },
});

const dialogForm = ref<FormInstance>();

function onDialogClose() {
  if (!dialogForm.value) return;
  dialogForm.value.resetFields();
}

function handleConfirm() {
  if (!dialogForm.value) return;
  dialogForm.value.validate((valid) => {
    if (valid) {
      emit('onConfirm');
    } else {
      return;
    }
  });
}
</script>