- 新增 .editorconfig 文件统一代码风格配置 - 新增 .env 环境变量配置文件 - 添加开发和生产环境的环境变量配置 - 配置 ESLint 忽略规则文件 - 设置代码检查配置文件 .eslintrc.js - 添加 Git 忽略文件规则 - 创建 Prettier 格式化忽略规则 - 添加隐私政策和服务协议HTML文件 - 实现访问密钥编辑组件基础结构
120 lines
3.1 KiB
Vue
120 lines
3.1 KiB
Vue
<!-- 搜索表单 -->
|
||
<template>
|
||
<a-space :size="10" style="flex-wrap: wrap">
|
||
<!-- <a-button type="primary" class="ele-btn-icon" @click="add">-->
|
||
<!-- <template #icon>-->
|
||
<!-- <PlusOutlined/>-->
|
||
<!-- </template>-->
|
||
<!-- <span>创建订单</span>-->
|
||
<!-- </a-button>-->
|
||
<a-input-search
|
||
allow-clear
|
||
placeholder="请输入项目名称"
|
||
v-model:value="where.keywords"
|
||
@pressEnter="search"
|
||
@search="search"
|
||
/>
|
||
<a-button @click="reset">重置</a-button>
|
||
<a-range-picker
|
||
v-model:value="dateRange"
|
||
@change="search"
|
||
value-format="YYYY-MM-DD"
|
||
/>
|
||
<a-button type="text" @click="onSearch('monthTotalPrice')">
|
||
<a-tooltip title="今年已收续费总额" class="flex flex-col">
|
||
<span class="text-gray-400">本月已收:</span>
|
||
<span class="text-orange-600 font-bold">¥{{ formatNumber(count.monthTotalPrice) }}</span>
|
||
</a-tooltip>
|
||
</a-button>
|
||
<a-button type="text" @click="onSearch('yearTotalPrice')">
|
||
<a-tooltip title="今年已收续费总额" class="flex flex-col">
|
||
<span class="text-gray-400">今年已收:</span>
|
||
<span class="text-green-600 font-bold">¥{{ formatNumber(count.yearTotalPrice) }}</span>
|
||
</a-tooltip>
|
||
</a-button>
|
||
<a-button type="text" @click="onSearch('lastTotalPrice')">
|
||
<a-tooltip title="去年已收续费总额" class="flex flex-col">
|
||
<span class="text-gray-400">去年总额:</span>
|
||
<span class="text-gray-700 font-bold">¥{{ formatNumber(count.lastTotalPrice) }}</span>
|
||
</a-tooltip>
|
||
</a-button>
|
||
</a-space>
|
||
</template>
|
||
|
||
<script lang="ts" setup>
|
||
import {PlusOutlined} from '@ant-design/icons-vue';
|
||
import {watch, ref} from 'vue';
|
||
import useSearch from "@/utils/use-search";
|
||
import {formatNumber} from 'ele-admin-pro/es';
|
||
import {ProjectCount, ProjectParam} from "@/api/project/project/model";
|
||
import {ProjectRenewParam} from "@/api/project/projectRenew/model";
|
||
import {countProjectRenew} from "@/api/project/projectRenew";
|
||
|
||
const props = withDefaults(
|
||
defineProps<{
|
||
// 选中的角色
|
||
selection?: [];
|
||
}>(),
|
||
{}
|
||
);
|
||
|
||
const emit = defineEmits<{
|
||
(e: 'search', where?: ProjectRenewParam): void;
|
||
(e: 'add'): void;
|
||
(e: 'remove'): void;
|
||
(e: 'batchMove'): void;
|
||
}>();
|
||
|
||
// 日期范围选择
|
||
const dateRange = ref<[string, string]>(['', '']);
|
||
const count = ref<ProjectCount>({
|
||
// 今年已收续费总总额
|
||
yearTotalPrice: undefined,
|
||
// 去年已收续费总额
|
||
lastTotalPrice: undefined,
|
||
// 近30天可催收的续费总额
|
||
totalPrice30: undefined,
|
||
// 本月已收续费总额
|
||
monthTotalPrice: undefined
|
||
});
|
||
|
||
// 表单数据
|
||
const {where,resetFields} = useSearch<ProjectParam>({
|
||
appId: undefined,
|
||
userId: undefined,
|
||
appStatus: undefined,
|
||
keywords: ''
|
||
});
|
||
|
||
// 新增
|
||
const add = () => {
|
||
emit('add');
|
||
};
|
||
|
||
/* 重置 */
|
||
const reset = () => {
|
||
resetFields();
|
||
search();
|
||
};
|
||
|
||
/* 搜索 */
|
||
const search = () => {
|
||
emit('search', where);
|
||
};
|
||
|
||
const onSearch = (text: string) => {
|
||
where.sceneType = text
|
||
search();
|
||
}
|
||
|
||
countProjectRenew().then(data => {
|
||
count.value = data;
|
||
})
|
||
|
||
watch(
|
||
() => props.selection,
|
||
() => {
|
||
}
|
||
);
|
||
</script>
|