feat: 设置-财务设置-费项管理
This commit is contained in:
Zzz1zz
+37
-1
@@ -30,6 +30,10 @@ import {
|
||||
TenantDictionaryType,
|
||||
SettingContractNumbeRes,
|
||||
CreateCodeSettingParam,
|
||||
FeeManagementListRes,
|
||||
CreateFeeParams,
|
||||
FeeManagementDetailRes,
|
||||
FeeSelectListParams,
|
||||
} from '@/types/setting';
|
||||
import { HttpResponse } from './interceptor';
|
||||
|
||||
@@ -328,7 +332,6 @@ export function getCodeSettingList(
|
||||
): Promise<SettingContractNumbeRes> {
|
||||
return axios.post(`contractSetting/getCodeSettingList`, params);
|
||||
}
|
||||
|
||||
// 合同设置-合同条款设置-全部启用列表
|
||||
export function getAllTermsSettingList(): Promise<SettingContractNumbeRes> {
|
||||
return axios.get(`contractSetting/getAllTermsSettingList`);
|
||||
@@ -367,3 +370,36 @@ export function getTermsSettingList(
|
||||
): Promise<SettingContractNumbeRes> {
|
||||
return axios.post(`contractSetting/getTermsSettingList`, params);
|
||||
}
|
||||
|
||||
// 合同设置-财务设置-全部列表（带分页）
|
||||
export function getFeeList(
|
||||
params: PaginationParams
|
||||
): Promise<FeeManagementListRes> {
|
||||
return axios.post(`financeSetting/getFeeList`, params);
|
||||
}
|
||||
// 合同设置-财务设置-新增
|
||||
export function createFee(params: CreateFeeParams): Promise<HttpResponse> {
|
||||
return axios.post(`financeSetting/createFee`, params);
|
||||
}
|
||||
// 合同设置-财务设置-编辑
|
||||
export function updateFee(params: CreateFeeParams): Promise<HttpResponse> {
|
||||
return axios.post(`financeSetting/updateFee`, params);
|
||||
}
|
||||
// 合同设置-财务设置-删除
|
||||
export function delFee(id: number): Promise<HttpResponse> {
|
||||
return axios.get(`financeSetting/delFee?id=${id}`);
|
||||
}
|
||||
// 合同设置-财务设置-单个详情
|
||||
export function getFeeFromId(id: number): Promise<FeeManagementDetailRes> {
|
||||
return axios.get(`financeSetting/getFee?id=${id}`);
|
||||
}
|
||||
// 合同设置-财务设置-启用/禁用
|
||||
export function disableFee(params: DisableUserParam): Promise<HttpResponse> {
|
||||
return axios.post(`financeSetting/disableFee`, params);
|
||||
}
|
||||
// 合同设置-财务设置-获取下拉列表
|
||||
export function getUseFeeList(
|
||||
params: FeeSelectListParams
|
||||
): Promise<FeeManagementListRes> {
|
||||
return axios.post(`financeSetting/getUseFeeList`, params);
|
||||
}
|
||||
|
||||
@@ -67,6 +67,12 @@ interface UseDataTableReturn {
|
||||
stripe: boolean;
|
||||
tableLayout: 'auto' | 'fixed';
|
||||
};
|
||||
// 设置页码
|
||||
setPageSizeOptions: (sizeOptions: number[]) => void;
|
||||
pageSizeOptions: Ref<number[]>;
|
||||
// setShowTotal: (val: boolean) => void;
|
||||
// setShowJumper: (val: boolean) => void;
|
||||
// setShowPageSize: (val: boolean) => void;
|
||||
}
|
||||
|
||||
export default function useDataTable(
|
||||
@@ -93,16 +99,19 @@ export default function useDataTable(
|
||||
const current = ref(initialPage);
|
||||
const pageSize = ref(initialPageSize);
|
||||
const total = ref(0);
|
||||
|
||||
const copyPageSizeOptions = ref(pageSizeOptions);
|
||||
const copyShowTotal = ref(showTotal);
|
||||
const copyShowJumper = ref(showJumper);
|
||||
const copyShowPageSize = ref(showPageSize);
|
||||
// 分页配置
|
||||
const pagination = computed<PaginationProps>(() => ({
|
||||
current: current.value,
|
||||
pageSize: pageSize.value,
|
||||
total: total.value,
|
||||
showTotal,
|
||||
showJumper,
|
||||
showPageSize,
|
||||
pageSizeOptions,
|
||||
showTotal: copyShowTotal.value,
|
||||
showJumper: copyShowJumper.value,
|
||||
showPageSize: copyShowPageSize.value,
|
||||
pageSizeOptions: copyPageSizeOptions.value,
|
||||
}));
|
||||
|
||||
// 表格配置
|
||||
@@ -145,7 +154,21 @@ export default function useDataTable(
|
||||
// 切换每页条数时重置到第一页
|
||||
current.value = 1;
|
||||
};
|
||||
const setPageSizeOptions = (sizeOptions: number[]) => {
|
||||
copyPageSizeOptions.value = sizeOptions;
|
||||
};
|
||||
|
||||
// const setShowTotal = (val: boolean) => {
|
||||
// copyShowTotal.value = val;
|
||||
// };
|
||||
|
||||
// const setShowJumper = (val: boolean) => {
|
||||
// copyShowJumper.value = val;
|
||||
// };
|
||||
|
||||
// const setShowPageSize = (val: boolean) => {
|
||||
// copyShowPageSize.value = val;
|
||||
// };
|
||||
// 重置分页
|
||||
const resetPagination = () => {
|
||||
current.value = initialPage;
|
||||
@@ -168,5 +191,11 @@ export default function useDataTable(
|
||||
setPageSize,
|
||||
resetPagination,
|
||||
tableConfig,
|
||||
setPageSizeOptions,
|
||||
pageSizeOptions: copyPageSizeOptions,
|
||||
|
||||
// setShowTotal,
|
||||
// setShowJumper,
|
||||
// setShowPageSize,
|
||||
};
|
||||
}
|
||||
|
||||
@@ -121,6 +121,7 @@ export default {
|
||||
'setting.process': '流程设置',
|
||||
'setting.project': '项目设置',
|
||||
'setting.contract': '合同设置',
|
||||
'setting.finance': '财务设置',
|
||||
'setting.data-dictionary': '数据字典',
|
||||
|
||||
...localeSettings,
|
||||
|
||||
@@ -126,6 +126,18 @@ const SETTING: AppRouteRecordRaw = {
|
||||
roles: ['*'],
|
||||
},
|
||||
},
|
||||
// 财务设置
|
||||
{
|
||||
path: 'finance',
|
||||
name: 'system-setting-finance',
|
||||
component: () =>
|
||||
import('@/views/setting/system/finance-settings/index.vue'),
|
||||
meta: {
|
||||
locale: 'setting.finance',
|
||||
requiresAuth: true,
|
||||
roles: ['*'],
|
||||
},
|
||||
},
|
||||
// 数据字典
|
||||
{
|
||||
path: 'data-dictionary',
|
||||
|
||||
+42
-2
@@ -28,7 +28,11 @@ export type ProjectTypeChecked = 0 | 1; // 是否选择：1是 0否
|
||||
export type TenantDictionaryType = 1 | 2 | 3 | 4; // 类型：1租客类型，2租客来源，3租客行业分类，4租客企业规模
|
||||
export type ContractSettingStatus = 0 | 1; // 0不回收，1回收
|
||||
export type delCodeRecycling = 0 | 1; // 删除合同编号回收：0不回收，1回收
|
||||
export type cancelCodeRecycling = 0 | 1;
|
||||
export type cancelCodeRecycling = 0 | 1; // 作废合同编号回收：0不回收，1回收
|
||||
export type CommStatus = 1 | 2; // 1:是 2否
|
||||
export type FeeManagementType = 1 | 2; // 费项属性：1收入费项，2支出费项
|
||||
export type FeeType = 1 | 2 | 3 | 4; // 费项类型：1租赁类，2物业类，3特殊类，4其他类
|
||||
|
||||
// ==================== 部门相关类型 ====================
|
||||
export interface DepartmentFormParams {
|
||||
parent_id: number | null;
|
||||
@@ -244,7 +248,36 @@ export interface CreateCodeSettingParam {
|
||||
del_code_recycling: delCodeRecycling;
|
||||
arrange: ArrangeInfo[];
|
||||
}
|
||||
|
||||
export interface FeeManagement extends BaseEntity {
|
||||
name: string; // 名称
|
||||
type: CommStatus; // 是否为系统类型：1是 2否
|
||||
feeAttribute: FeeManagementType; // 费项属性：1收入费项，2支出费项
|
||||
feeType: FeeType; // 费项类型：1租赁类，2物业类，3特殊类，4其他类
|
||||
isBond: CommStatus; // 是否保证金：1是，2否
|
||||
taxRate: string; // 税率%
|
||||
status: UserStatus; // 状态：1 启用，2 禁用
|
||||
createUserId: number;
|
||||
isDelete: number;
|
||||
statusStr: string; // 状态名称
|
||||
feeAttributeStr: string; // 费项属性名称
|
||||
feeTypeStr: string; // 费项类型名称
|
||||
isBondStr: string; // 是否保证金状态名称
|
||||
createdAt: string;
|
||||
updatedAt: string;
|
||||
}
|
||||
export interface CreateFeeParams {
|
||||
id?: number;
|
||||
name: string;
|
||||
fee_attribute: FeeManagementType;
|
||||
fee_type: FeeType;
|
||||
is_bond: CommStatus;
|
||||
tax_rate: string;
|
||||
}
|
||||
export interface FeeSelectListParams {
|
||||
fee_attribute: FeeManagementType; // 费项属性：1收入费项，2支出费项
|
||||
fee_type: FeeType; // 费项类型：1租赁类，2物业类，3特殊类，4其他类
|
||||
is_bond: CommStatus; // 是否保证金：1是，2否
|
||||
}
|
||||
// ==================== 响应类型别名 ====================
|
||||
export type DepartmentFormRes = HttpResponse<DepartmentIdData>;
|
||||
export type DepartmentList = DepartmentItem[];
|
||||
@@ -285,3 +318,10 @@ export type SettingContractNumbeRes = HttpResponse<{
|
||||
contractCodeSetting: ContractTermInfo[];
|
||||
page?: PaginationParams & PaginationResult;
|
||||
}>;
|
||||
export type FeeManagementListRes = HttpResponse<{
|
||||
list: FeeManagement[];
|
||||
page?: PaginationParams & PaginationResult;
|
||||
}>;
|
||||
export type FeeManagementDetailRes = HttpResponse<{
|
||||
fee: FeeManagement;
|
||||
}>;
|
||||
|
||||
@@ -46,7 +46,7 @@
|
||||
</a-space>
|
||||
</template>
|
||||
</DataTable>
|
||||
<contractNumberFormModal
|
||||
<contractNumberFormDrawer
|
||||
v-model:visible="showModal"
|
||||
:record="currentNumberInfo"
|
||||
:is-edit="isEdit"
|
||||
@@ -68,7 +68,7 @@
|
||||
} from '@/api/setting';
|
||||
import { ContractTermInfo, UserStatus } from '@/types/setting';
|
||||
import { camelToSnake } from '@/utils/caseConvert';
|
||||
import contractNumberFormModal from './modal/contract-number-form-modal.vue';
|
||||
import contractNumberFormDrawer from './drawer/contract-number-form-drawer.vue';
|
||||
|
||||
const {
|
||||
data: renderData,
|
||||
|
||||
@@ -46,7 +46,7 @@
|
||||
</a-space>
|
||||
</template>
|
||||
</DataTable>
|
||||
<contractNumberFormModal
|
||||
<contractNumberFormDrawer
|
||||
v-model:visible="showModal"
|
||||
:record="currentNumberInfo"
|
||||
:is-edit="isEdit"
|
||||
@@ -68,7 +68,7 @@
|
||||
} from '@/api/setting';
|
||||
import { ContractTermInfo, UserStatus } from '@/types/setting';
|
||||
import { camelToSnake } from '@/utils/caseConvert';
|
||||
import contractNumberFormModal from './modal/contract-terms-form-modal.vue';
|
||||
import contractNumberFormDrawer from './drawer/contract-terms-form-drawer.vue';
|
||||
|
||||
const {
|
||||
data: renderData,
|
||||
|
||||
-2
@@ -103,7 +103,6 @@
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref, watch, reactive, computed } from 'vue';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import type { FormInstance } from '@arco-design/web-vue';
|
||||
import { Message } from '@arco-design/web-vue';
|
||||
import { createCodeSetting, updateCodeSetting } from '@/api/setting';
|
||||
@@ -143,7 +142,6 @@
|
||||
arrange: arrangeList.value,
|
||||
};
|
||||
const form = reactive<any>({ ...defaultForm });
|
||||
const { t } = useI18n();
|
||||
// 校验规则
|
||||
const rules = reactive({
|
||||
name: [{ required: true, message: '请输入合同编号' }],
|
||||
-2
@@ -42,7 +42,6 @@
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref, watch, reactive } from 'vue';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import type { FormInstance } from '@arco-design/web-vue';
|
||||
import { Message } from '@arco-design/web-vue';
|
||||
import { createCodeSetting, updateCodeSetting } from '@/api/setting';
|
||||
@@ -70,7 +69,6 @@
|
||||
type: 1,
|
||||
};
|
||||
const form = reactive<any>({ ...defaultForm });
|
||||
const { t } = useI18n();
|
||||
// 校验规则
|
||||
const rules = reactive({
|
||||
name: [{ required: true, message: '请输入合同编号' }],
|
||||
@@ -0,0 +1,204 @@
|
||||
<template>
|
||||
<a-drawer
|
||||
:width="420"
|
||||
:visible="visible"
|
||||
:title="isEdit ? '编辑费项' : '新增费项'"
|
||||
unmount-on-close
|
||||
@ok="handleOk"
|
||||
@cancel="handleCancel"
|
||||
>
|
||||
<a-form
|
||||
ref="formRef"
|
||||
:model="form"
|
||||
:rules="rules"
|
||||
auto-label-width
|
||||
layout="vertical"
|
||||
>
|
||||
<!-- 费项属性 -->
|
||||
<a-form-item label="费项属性" field="fee_attribute" required>
|
||||
<a-radio-group
|
||||
v-model="form.fee_attribute"
|
||||
style="width: 100%"
|
||||
type="button"
|
||||
>
|
||||
<a-radio style="width: 50%; text-align: center" :value="1"
|
||||
>收入费项</a-radio
|
||||
>
|
||||
<a-radio style="width: 50%; text-align: center" :value="2"
|
||||
>支出费项</a-radio
|
||||
>
|
||||
</a-radio-group>
|
||||
</a-form-item>
|
||||
<!-- 费项名称 -->
|
||||
<a-form-item label="费项名称" field="name" required>
|
||||
<a-input
|
||||
v-model="form.name"
|
||||
:placeholder="$t('please.enter', { placeholder: '费项名称' })"
|
||||
/>
|
||||
</a-form-item>
|
||||
<!-- 费项类别 -->
|
||||
<a-form-item label="费项类别" field="fee_type" required>
|
||||
<a-select v-model="form.fee_type">
|
||||
<a-option
|
||||
v-for="item in feeTypeList"
|
||||
:key="item.value"
|
||||
:value="item.value"
|
||||
>
|
||||
{{ item.text }}</a-option
|
||||
>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
<!-- 是否保证金 -->
|
||||
<a-form-item label="是否保证金" field="is_bond" required>
|
||||
<a-radio-group v-model="form.is_bond" style="width: 100%" type="button">
|
||||
<a-radio style="width: 50%; text-align: center" :value="1"
|
||||
>是</a-radio
|
||||
>
|
||||
<a-radio style="width: 50%; text-align: center" :value="2"
|
||||
>否</a-radio
|
||||
>
|
||||
</a-radio-group>
|
||||
</a-form-item>
|
||||
<a-form-item label="费项税率" field="tax_rate" required>
|
||||
<a-input
|
||||
v-model.number="form.tax_rate"
|
||||
:placeholder="$t('please.enter', { placeholder: '费项税率' })"
|
||||
append="%"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</a-drawer>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref, watch, reactive } from 'vue';
|
||||
import type { FormInstance } from '@arco-design/web-vue';
|
||||
import { Message } from '@arco-design/web-vue';
|
||||
import { createFee, updateFee } from '@/api/setting';
|
||||
import { CreateFeeParams } from '@/types/setting';
|
||||
|
||||
const props = defineProps<{
|
||||
visible: boolean;
|
||||
isEdit: boolean;
|
||||
record?: CreateFeeParams | null;
|
||||
}>();
|
||||
const emit = defineEmits<{
|
||||
(e: 'update:visible', val: boolean): void;
|
||||
(e: 'submitted'): void;
|
||||
}>();
|
||||
const feeTypeList = [
|
||||
{ value: 1, text: '租赁类' },
|
||||
{ value: 2, text: '物业类' },
|
||||
{ value: 3, text: '特殊类' },
|
||||
{ value: 4, text: '其他类' },
|
||||
];
|
||||
// 表单数据
|
||||
const formRef = ref<FormInstance>();
|
||||
const defaultForm: CreateFeeParams = {
|
||||
name: '',
|
||||
fee_attribute: 1,
|
||||
fee_type: 1,
|
||||
is_bond: 2,
|
||||
tax_rate: '0',
|
||||
};
|
||||
const form = reactive<CreateFeeParams>({ ...defaultForm });
|
||||
// 校验规则
|
||||
const rules = reactive({
|
||||
name: [{ required: true, message: '请输入合同编号' }],
|
||||
fee_attribute: [{ required: true, message: '请选择费项属性' }],
|
||||
fee_type: [{ required: true, message: '请选择费项类别' }],
|
||||
is_bond: [{ required: true, message: '请选择是否保证金' }],
|
||||
tax_rate: [
|
||||
{ required: true, message: '请输入费项税率' },
|
||||
{
|
||||
validator: (value, cb) => {
|
||||
const int = Number(value);
|
||||
if (!int || int > 100) {
|
||||
cb('请输入正确的费项税率');
|
||||
} else {
|
||||
cb();
|
||||
}
|
||||
},
|
||||
},
|
||||
],
|
||||
});
|
||||
|
||||
watch(
|
||||
() => props.visible,
|
||||
(val) => {
|
||||
if (val) {
|
||||
if (props.isEdit && props.record) {
|
||||
Object.assign(form, props.record);
|
||||
} else {
|
||||
Object.assign(form, defaultForm);
|
||||
}
|
||||
}
|
||||
},
|
||||
{ immediate: true }
|
||||
);
|
||||
const handleOk = async () => {
|
||||
try {
|
||||
const valid = await formRef.value.validate();
|
||||
if (valid) return;
|
||||
const res = props?.isEdit ? await updateFee(form) : await createFee(form);
|
||||
if (res?.code === 200) {
|
||||
Message.success(res?.message);
|
||||
emit('submitted');
|
||||
emit('update:visible', false);
|
||||
}
|
||||
} catch (err) {
|
||||
// 捕获异常，暂不处理
|
||||
}
|
||||
};
|
||||
|
||||
const handleCancel = () => {
|
||||
emit('update:visible', false);
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
:deep(label.arco-form-item-label) {
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
.label_wrap {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
.left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.required {
|
||||
color: #f53f3f;
|
||||
margin-right: 4px;
|
||||
font-size: 16px;
|
||||
line-height: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.right {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 4px;
|
||||
}
|
||||
}
|
||||
|
||||
.numbering {
|
||||
background-color: #eaf3fe;
|
||||
padding: 5px 10px;
|
||||
width: 100%;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.arrange_left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.text {
|
||||
margin-left: 7px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,195 @@
|
||||
<template>
|
||||
<DataTable
|
||||
:data="renderData"
|
||||
pagination
|
||||
:columns="projectColumn"
|
||||
:loading="loading"
|
||||
:total="total"
|
||||
:current="current"
|
||||
:page-size="pageSize"
|
||||
:page-size-options="pageSizeOptions"
|
||||
@page-change="onPageChange"
|
||||
@page-size-change="onPageSizeChange"
|
||||
>
|
||||
<template #status="{ record }">
|
||||
<a-tag :color="record.status == 1 ? 'green' : 'red'">
|
||||
{{ record.status == 1 ? $t('enable') : $t('disable') }}</a-tag
|
||||
>
|
||||
</template>
|
||||
<template #operate="{ record }">
|
||||
<a-space>
|
||||
<a-button type="primary" @click="handleEdit(record.id)">
|
||||
{{ $t('edit') }}</a-button
|
||||
>
|
||||
<a-popover trigger="click" position="bottom">
|
||||
<a-button>{{ $t('more') }}</a-button>
|
||||
<template #content>
|
||||
<a-space direction="vertical">
|
||||
<a-button @click="handleToggleStatus(record.id, record.status)">
|
||||
{{ record.status == 1 ? $t('disable') : $t('enable') }}
|
||||
</a-button>
|
||||
<a-button status="danger" @click="handleDel(record.id)">
|
||||
{{ $t('delete') }}
|
||||
</a-button>
|
||||
</a-space>
|
||||
</template>
|
||||
</a-popover>
|
||||
</a-space>
|
||||
</template>
|
||||
</DataTable>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { onMounted, ref, watch } from 'vue';
|
||||
import useDataTable from '@/composables/useDataTable';
|
||||
import type { TableColumnData } from '@arco-design/web-vue';
|
||||
import { getFeeList, disableFee, delFee } from '@/api/setting';
|
||||
import { FeeType, FeeManagement, UserStatus } from '@/types/setting';
|
||||
import { Message } from '@arco-design/web-vue';
|
||||
|
||||
const props = defineProps<{
|
||||
type: FeeType;
|
||||
isSubmitted: boolean;
|
||||
}>();
|
||||
const {
|
||||
data: renderData,
|
||||
columns: projectColumn,
|
||||
total,
|
||||
loading,
|
||||
current,
|
||||
pageSize,
|
||||
setData,
|
||||
setColumns,
|
||||
setTotal,
|
||||
setLoading,
|
||||
setCurrent,
|
||||
setPageSize,
|
||||
} = useDataTable({
|
||||
initialPage: 1,
|
||||
initialPageSize: 5,
|
||||
pageSizeOptions: [5, 10, 15, 20],
|
||||
});
|
||||
const pageSizeOptions = [5, 10, 15, 20];
|
||||
const feeListData = ref<FeeManagement[]>([]);
|
||||
const getFeeListData = async () => {
|
||||
setLoading(true);
|
||||
const params = {
|
||||
page: current.value,
|
||||
page_size: pageSize.value,
|
||||
fee_attribute: props.type,
|
||||
};
|
||||
const { code, data } = await getFeeList(params);
|
||||
setLoading(false);
|
||||
if (code === 200) {
|
||||
const { list, page } = data;
|
||||
const feeList = list ?? [];
|
||||
if (feeList.length === 0) return;
|
||||
feeListData.value = feeList;
|
||||
setData(feeListData.value);
|
||||
setTotal(page?.total ? page.total : 0);
|
||||
}
|
||||
};
|
||||
|
||||
// 列配置
|
||||
const columns: TableColumnData[] = [
|
||||
{
|
||||
title: '费项名称',
|
||||
dataIndex: 'name',
|
||||
key: 'name',
|
||||
width: 120,
|
||||
ellipsis: true,
|
||||
},
|
||||
{
|
||||
title: '类别',
|
||||
dataIndex: 'feeTypeStr',
|
||||
key: 'feeTypeStr',
|
||||
width: 150,
|
||||
ellipsis: true,
|
||||
},
|
||||
{
|
||||
title: '是否保证金',
|
||||
dataIndex: 'isBondStr',
|
||||
key: 'isBond',
|
||||
},
|
||||
{
|
||||
title: '税率',
|
||||
dataIndex: 'taxRate',
|
||||
key: 'taxRate',
|
||||
},
|
||||
{
|
||||
title: '更新时间',
|
||||
dataIndex: 'updatedAt',
|
||||
key: 'updatedAt',
|
||||
},
|
||||
{
|
||||
title: '状态',
|
||||
dataIndex: 'status',
|
||||
key: 'status',
|
||||
slotName: 'status',
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
key: 'operate',
|
||||
slotName: 'operate',
|
||||
width: 200,
|
||||
},
|
||||
];
|
||||
// 分页事件处理
|
||||
const onPageChange = (page: number) => {
|
||||
setCurrent(page);
|
||||
current.value = page;
|
||||
getFeeListData();
|
||||
};
|
||||
const onPageSizeChange = (size: number) => {
|
||||
setPageSize(size);
|
||||
pageSize.value = size;
|
||||
getFeeListData();
|
||||
};
|
||||
const emit = defineEmits<{
|
||||
(e: 'update:visible', val: boolean): void;
|
||||
(e: 'edit', id: number): void;
|
||||
}>();
|
||||
const handleEdit = (id: number) => {
|
||||
emit('edit', id);
|
||||
};
|
||||
const handleToggleStatus = async (id: number, currentStatus: UserStatus) => {
|
||||
try {
|
||||
const status: UserStatus = currentStatus === 1 ? 2 : 1;
|
||||
const param = { id, status };
|
||||
const { code, message } = await disableFee(param);
|
||||
if (code === 200) {
|
||||
Message.success(message);
|
||||
getFeeListData();
|
||||
} else {
|
||||
Message.error(message);
|
||||
}
|
||||
} catch (error) {
|
||||
// 处理错误
|
||||
}
|
||||
};
|
||||
const handleDel = async (id: number) => {
|
||||
try {
|
||||
const { code, message } = await delFee(id);
|
||||
if (code === 200) {
|
||||
Message.success(message);
|
||||
getFeeListData();
|
||||
} else {
|
||||
Message.error(message);
|
||||
}
|
||||
} catch (error) {
|
||||
// 处理错误
|
||||
}
|
||||
};
|
||||
|
||||
watch(
|
||||
() => props.isSubmitted,
|
||||
(newVal) => {
|
||||
if (newVal) getFeeListData();
|
||||
}
|
||||
);
|
||||
|
||||
onMounted(() => {
|
||||
setColumns(columns);
|
||||
getFeeListData();
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,66 @@
|
||||
<template>
|
||||
<a-card title="费项管理">
|
||||
<template #extra>
|
||||
<a-button type="primary" @click="handleAdd"><icon-plus />新增</a-button>
|
||||
</template>
|
||||
<a-tabs v-model:active-key="currentTabsKey" class="tabs_card">
|
||||
<a-tab-pane key="1" title="收入费项">
|
||||
<feeManagementTable
|
||||
v-if="currentTabsKey === '1'"
|
||||
:is-submitted="isSubmitted"
|
||||
:type="1"
|
||||
@edit="handleEdit"
|
||||
/>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="2" title="支出费项">
|
||||
<feeManagementTable
|
||||
v-if="currentTabsKey === '2'"
|
||||
:is-submitted="isSubmitted"
|
||||
:type="2"
|
||||
@edit="handleEdit"
|
||||
/>
|
||||
</a-tab-pane>
|
||||
</a-tabs>
|
||||
<feeManagementDrawer
|
||||
v-model:visible="visible"
|
||||
:is-edit="isEdit"
|
||||
:record="currentRecord"
|
||||
@submitted="onSubmitted"
|
||||
/>
|
||||
</a-card>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref } from 'vue';
|
||||
import { getFeeFromId } from '@/api/setting';
|
||||
import feeManagementTable from './fee-management-table.vue';
|
||||
import feeManagementDrawer from './drawer/fee-management-drawer.vue';
|
||||
|
||||
const currentTabsKey = ref<string>('1');
|
||||
const visible = ref<boolean>(false);
|
||||
const isEdit = ref<boolean>(false);
|
||||
const currentRecord = ref<any | null>(null);
|
||||
const isSubmitted = ref<boolean>(false);
|
||||
const handleAdd = () => {
|
||||
isEdit.value = false;
|
||||
currentRecord.value = null;
|
||||
visible.value = true;
|
||||
isSubmitted.value = false;
|
||||
};
|
||||
const getFeeInfoFromId = async (id: number) => {
|
||||
const { code, data } = await getFeeFromId(id);
|
||||
if (code === 200 && data) {
|
||||
const { fee } = data;
|
||||
if (fee) currentRecord.value = fee;
|
||||
}
|
||||
};
|
||||
const handleEdit = async (id: number) => {
|
||||
isEdit.value = true;
|
||||
isSubmitted.value = false;
|
||||
await getFeeInfoFromId(id);
|
||||
visible.value = true;
|
||||
};
|
||||
const onSubmitted = () => {
|
||||
isSubmitted.value = true;
|
||||
};
|
||||
</script>
|
||||
@@ -0,0 +1,131 @@
|
||||
<template>
|
||||
<div class="system-setting-general">
|
||||
<Breadcrumb
|
||||
:items="['menu.setting', 'menu.setting.system', 'setting.finance']"
|
||||
/>
|
||||
<a-card class="full_height" :title="t('setting.finance')">
|
||||
<a-row :gutter="12">
|
||||
<a-col :span="6">
|
||||
<ul class="setting_tabs_list">
|
||||
<li
|
||||
v-for="item in financeSettingTabs"
|
||||
:key="item.id"
|
||||
:class="[
|
||||
'setting_tabs_item',
|
||||
{ isChoose: currentSettingId === item.id },
|
||||
]"
|
||||
@click="chooseSettingTab(item.id)"
|
||||
>
|
||||
{{ item.text }}
|
||||
</li>
|
||||
</ul>
|
||||
</a-col>
|
||||
<a-col :span="18">
|
||||
<feeManagement v-if="currentSettingId === 5" />
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-card>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref } from 'vue';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import feeManagement from './fee-management.vue';
|
||||
// import { } from '@/api/setting';
|
||||
// import { Message } from '@arco-design/web-vue';
|
||||
|
||||
const { t } = useI18n();
|
||||
const currentSettingId = ref<number>(5);
|
||||
const financeSettingTabs = [
|
||||
{ id: 1, text: '财务通用' },
|
||||
{ id: 2, text: '通知单模板' },
|
||||
{ id: 3, text: '通知单发送方式' },
|
||||
{ id: 4, text: '流水账户' },
|
||||
{ id: 5, text: '费项管理' },
|
||||
];
|
||||
const chooseSettingTab = (id: number) => {
|
||||
if (id === currentSettingId.value) return;
|
||||
currentSettingId.value = id;
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.system-setting-general {
|
||||
.setting_tabs_list {
|
||||
border-radius: 6px;
|
||||
border: 1px solid rgba(239, 239, 239, 1);
|
||||
padding: 14px 0;
|
||||
padding-bottom: 200px;
|
||||
|
||||
.setting_tabs_item {
|
||||
padding: 0 20px;
|
||||
height: 42px;
|
||||
line-height: 42px;
|
||||
color: #000;
|
||||
background-color: #fff;
|
||||
cursor: pointer;
|
||||
|
||||
&.isChoose {
|
||||
background-color: #efefef;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.project_house_list {
|
||||
.project_house_item {
|
||||
margin-top: 20px;
|
||||
|
||||
&:first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.options {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
background-color: #f2f3f5;
|
||||
width: 430px;
|
||||
height: 36px;
|
||||
margin-top: 10px;
|
||||
padding: 0 3px;
|
||||
|
||||
.subItem {
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
padding: 4px 0;
|
||||
cursor: pointer;
|
||||
|
||||
&.isActive {
|
||||
background-color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.in_rented_area,
|
||||
.cumulative_leasing_rate {
|
||||
.tips {
|
||||
color: rgba(187, 187, 187, 1);
|
||||
font-size: 12px;
|
||||
margin-top: 4px;
|
||||
}
|
||||
|
||||
.desc {
|
||||
background-color: #eaf3fe;
|
||||
border-radius: 2px;
|
||||
background-color: rgba(232, 243, 255, 1);
|
||||
color: rgba(29, 33, 41, 1);
|
||||
font-size: 14px;
|
||||
text-align: left;
|
||||
border: 0px solid rgba(121, 121, 121, 1);
|
||||
padding: 12px;
|
||||
margin-top: 12px;
|
||||
}
|
||||
|
||||
.title_item {
|
||||
margin-top: 24px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user