This commit is contained in:
2026-04-21 17:24:51 +08:00
parent d47ef8d680
commit 4f45ecbd63
13 changed files with 675 additions and 105 deletions
+20
View File
@@ -39,3 +39,23 @@ export function refundLog(params?: any) {
export function refundStat(params?: any) {
return request.get({ url: '/finance.refund/stat', params })
}
// 账户消耗列表
export function accountCostLists(params?: any) {
return request.get({ url: '/finance.account_cost/lists', params })
}
// 账户消耗新增
export function accountCostAdd(params?: any) {
return request.post({ url: '/finance.account_cost/add', params })
}
// 账户消耗编辑
export function accountCostEdit(params?: any) {
return request.post({ url: '/finance.account_cost/edit', params })
}
// 账户消耗详情
export function accountCostDetail(params?: any) {
return request.get({ url: '/finance.account_cost/detail', params })
}
@@ -0,0 +1,127 @@
<template>
<div class="edit-popup">
<popup
ref="popupRef"
:title="popupTitle"
:async="true"
width="560px"
@confirm="handleSubmit"
@close="handleClose"
>
<el-form ref="formRef" :model="formData" label-width="100px" :rules="formRules">
<el-form-item label="日期" prop="cost_date">
<el-date-picker
v-model="formData.cost_date"
type="date"
value-format="YYYY-MM-DD"
placeholder="请选择日期"
:disabled="mode === 'edit'"
/>
</el-form-item>
<el-form-item label="账户消耗" prop="amount">
<el-input-number
v-model="formData.amount"
:min="0"
:step="0.01"
:precision="2"
class="w-full"
/>
</el-form-item>
<el-form-item label="备注" prop="remark">
<el-input
v-model="formData.remark"
type="textarea"
:autosize="{ minRows: 4, maxRows: 6 }"
maxlength="255"
show-word-limit
placeholder="请输入备注"
/>
</el-form-item>
</el-form>
</popup>
</div>
</template>
<script lang="ts" setup>
import type { FormInstance } from 'element-plus'
import { accountCostAdd, accountCostDetail, accountCostEdit } from '@/api/finance'
import Popup from '@/components/popup/index.vue'
const emit = defineEmits(['success', 'close'])
const formRef = shallowRef<FormInstance>()
const popupRef = shallowRef<InstanceType<typeof Popup>>()
const mode = ref<'add' | 'edit'>('add')
const popupTitle = computed(() => (mode.value === 'edit' ? '编辑账户消耗' : '新增账户消耗'))
const formData = reactive({
id: '',
cost_date: '',
amount: 0,
remark: '',
})
const formRules = {
cost_date: [
{
required: true,
message: '请选择日期',
trigger: ['change'],
},
],
amount: [
{
required: true,
message: '请输入账户消耗金额',
trigger: ['blur', 'change'],
},
],
}
const resetForm = () => {
formData.id = ''
formData.cost_date = ''
formData.amount = 0
formData.remark = ''
}
const handleSubmit = async () => {
await formRef.value?.validate()
if (mode.value === 'edit') {
await accountCostEdit(formData)
} else {
await accountCostAdd(formData)
}
popupRef.value?.close()
emit('success')
}
const open = (type: 'add' | 'edit' = 'add') => {
mode.value = type
resetForm()
popupRef.value?.open()
}
const setFormData = (data: Record<string, any>) => {
formData.id = data.id ?? ''
formData.cost_date = data.cost_date ?? ''
formData.amount = Number(data.amount ?? 0)
formData.remark = data.remark ?? ''
}
const getDetail = async (row: Record<string, any>) => {
const data = await accountCostDetail({ id: row.id })
setFormData(data)
}
const handleClose = () => {
emit('close')
}
defineExpose({
open,
setFormData,
getDetail,
})
</script>
@@ -0,0 +1,122 @@
<template>
<div class="account-cost-list">
<el-card class="!border-none mb-4" shadow="never">
<div class="flex flex-wrap">
<div class="w-1/2 md:w-1/3">
<div class="leading-10">当前筛选天数</div>
<div class="text-4xl">{{ pager.extend.days_count ?? 0 }}</div>
</div>
<div class="w-1/2 md:w-1/3">
<div class="leading-10">累计账户消耗 ()</div>
<div class="text-4xl">¥{{ pager.extend.total_amount ?? '0.00' }}</div>
</div>
</div>
</el-card>
<el-card class="!border-none" shadow="never">
<el-form class="mb-[-16px]" :model="queryParams" inline>
<el-form-item label="日期范围">
<daterange-picker
v-model:startTime="queryParams.start_date"
v-model:endTime="queryParams.end_date"
/>
</el-form-item>
<el-form-item class="w-[280px]" label="备注/维护人">
<el-input
v-model="queryParams.remark"
placeholder="备注 / 创建人 / 修改人"
clearable
@keyup.enter="resetPage"
/>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="resetPage">查询</el-button>
<el-button @click="handleReset">重置</el-button>
</el-form-item>
</el-form>
</el-card>
<el-card class="!border-none mt-4" shadow="never">
<div>
<el-button v-perms="['finance.account_cost/add']" type="primary" @click="handleAdd">
<template #icon>
<icon name="el-icon-Plus" />
</template>
新增
</el-button>
</div>
<el-table class="mt-4" size="large" v-loading="pager.loading" :data="pager.lists">
<el-table-column label="日期" prop="cost_date" min-width="120" />
<el-table-column label="账户消耗" min-width="120">
<template #default="{ row }">¥{{ row.amount }}</template>
</el-table-column>
<el-table-column label="备注" prop="remark" min-width="260" show-overflow-tooltip />
<el-table-column label="创建人" prop="creator_name" min-width="100" />
<el-table-column label="最后修改人" prop="updater_name" min-width="100" />
<el-table-column label="更新时间" prop="update_time" min-width="180" />
<el-table-column label="操作" width="120" fixed="right">
<template #default="{ row }">
<el-button
v-perms="['finance.account_cost/edit']"
type="primary"
link
@click="handleEdit(row)"
>
编辑
</el-button>
</template>
</el-table-column>
</el-table>
<div class="flex justify-end mt-4">
<pagination v-model="pager" @change="getLists" />
</div>
</el-card>
<edit-popup v-if="showEdit" ref="editRef" @success="getLists" @close="showEdit = false" />
</div>
</template>
<script lang="ts" setup name="accountCostList">
import { accountCostLists } from '@/api/finance'
import { usePaging } from '@/hooks/usePaging'
import EditPopup from './edit.vue'
const editRef = shallowRef<InstanceType<typeof EditPopup>>()
const showEdit = ref(false)
const queryParams = reactive({
start_date: '',
end_date: '',
remark: '',
})
const { pager, getLists, resetPage } = usePaging({
fetchFun: accountCostLists,
params: queryParams,
})
const handleAdd = async () => {
showEdit.value = true
await nextTick()
editRef.value?.open('add')
}
const handleEdit = async (row: any) => {
showEdit.value = true
await nextTick()
editRef.value?.open('edit')
editRef.value?.getDetail(row)
}
const handleReset = () => {
queryParams.start_date = ''
queryParams.end_date = ''
queryParams.remark = ''
resetPage()
}
getLists()
</script>
+43 -5
View File
@@ -326,6 +326,7 @@ const summaryCards: MetricCard[] = [
{ key: 'completed_order_count', label: '接诊诊单', type: 'count' },
{ key: 'completed_order_amount', label: '诊单金额', type: 'money' },
{ key: 'account_cost', label: '账户消耗', type: 'money' },
{ key: 'cash_cost', label: '现金成本', type: 'money' },
{ key: 'roi', label: 'ROI', type: 'ratio' }
]
@@ -346,7 +347,6 @@ const tableColumns: MetricColumn[] = [
{ key: 'interview_receive_rate', label: '面诊接诊率', type: 'percent', minWidth: 130 },
{ key: 'open_receive_rate', label: '开口接诊率', type: 'percent', placeholder: true, minWidth: 120 },
{ key: 'avg_unit_price', label: '平均单价', type: 'money', minWidth: 110 },
{ key: 'account_cost', label: '账户消耗', type: 'money', minWidth: 120 },
{ key: 'cash_cost', label: '现金成本', type: 'money', minWidth: 110 },
{ key: 'roi', label: 'ROI', type: 'ratio', minWidth: 90 }
]
@@ -421,12 +421,31 @@ const rankingChartOption = computed(() => ({
const amountPieOption = computed(() => ({
tooltip: { trigger: 'item' },
legend: { bottom: 0 },
legend: {
bottom: 0,
type: 'scroll',
pageIconColor: '#409eff',
pageTextStyle: {
color: '#909399',
},
},
series: [
{
name: '诊单金额',
type: 'pie',
radius: ['42%', '72%'],
radius: ['42%', '70%'],
center: ['50%', '42%'],
avoidLabelOverlap: true,
minAngle: 3,
label: {
show: true,
formatter: '{b}',
overflow: 'truncate',
width: 90,
},
labelLayout: {
hideOverlap: true,
},
data: overview.charts.amount_share
}
]
@@ -434,12 +453,31 @@ const amountPieOption = computed(() => ({
const fanPieOption = computed(() => ({
tooltip: { trigger: 'item' },
legend: { bottom: 0 },
legend: {
bottom: 0,
type: 'scroll',
pageIconColor: '#409eff',
pageTextStyle: {
color: '#909399',
},
},
series: [
{
name: '加粉数',
type: 'pie',
radius: ['42%', '72%'],
radius: ['42%', '70%'],
center: ['50%', '42%'],
avoidLabelOverlap: true,
minAngle: 3,
label: {
show: true,
formatter: '{b}',
overflow: 'truncate',
width: 90,
},
labelLayout: {
hideOverlap: true,
},
data: overview.charts.fan_share
}
]