Compare commits
2 Commits
38b905400e
...
b63f5a059b
| Author | SHA1 | Date |
|---|---|---|
|
|
b63f5a059b | |
|
|
e34f2712e4 |
|
|
@ -3,7 +3,7 @@ import Panel from '../common/Panel.vue';
|
||||||
import {defineEmits, defineModel,defineProps} from 'vue'
|
import {defineEmits, defineModel,defineProps} from 'vue'
|
||||||
|
|
||||||
const {status}=defineProps(['status'])
|
const {status}=defineProps(['status'])
|
||||||
const emit = defineEmits(['save','deleteItem','openCheckOut',"openSettlement"]);
|
const emit = defineEmits(['save','deleteItem','openCheckOut',"openSettlement","print","refund"]);
|
||||||
const save = () => {
|
const save = () => {
|
||||||
emit('save');
|
emit('save');
|
||||||
};
|
};
|
||||||
|
|
@ -28,10 +28,6 @@ const openSettlement =()=>{
|
||||||
<span class="default-btn" @click="openSettlement" style="margin-left: 24px">收费</span>
|
<span class="default-btn" @click="openSettlement" style="margin-left: 24px">收费</span>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<div class="btn-group" v-else>
|
|
||||||
<span class="default-btn" @click="">打印</span>
|
|
||||||
<span class="default-btn" @click="" style="margin-left: 24px">退款</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</Panel>
|
</Panel>
|
||||||
</template>
|
</template>
|
||||||
|
|
|
||||||
|
|
@ -79,13 +79,56 @@
|
||||||
<div class="statistics-chart">
|
<div class="statistics-chart">
|
||||||
<div class="business-map">
|
<div class="business-map">
|
||||||
<Panel title="营业收入趋势">
|
<Panel title="营业收入趋势">
|
||||||
<div v-if="data.payTypeRevenue.length" ref="chartRef" style="width: 100%;height: 100%"></div>
|
<template #tools>
|
||||||
|
<div class="time">
|
||||||
|
<div class="time_box"
|
||||||
|
v-for="(item,index) in weekAndMonth"
|
||||||
|
:key="index"
|
||||||
|
:class="{active:curIncomeDate?.name==item.name}"
|
||||||
|
@click="changeIncomeDate(item)"
|
||||||
|
>
|
||||||
|
<span>{{ item.name }}</span>
|
||||||
|
</div>
|
||||||
|
<el-date-picker
|
||||||
|
v-model="selectIncomeDate"
|
||||||
|
type="daterange"
|
||||||
|
@change="changeSelectIncomeDate"
|
||||||
|
range-separator="-"
|
||||||
|
start-placeholder="开始日期"
|
||||||
|
end-placeholder="结束日期"
|
||||||
|
style="margin-left: 24px"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<div v-if="data.payTypeRevenue.length" id="incomeChart" ref="chartRef" style="width: 100%;height: 100%"></div>
|
||||||
<el-empty v-else description="暂无数据"/>
|
<el-empty v-else description="暂无数据"/>
|
||||||
</Panel>
|
</Panel>
|
||||||
</div>
|
</div>
|
||||||
<div class="consumption-map">
|
<div class="consumption-map">
|
||||||
<Panel title="消费人次趋势">
|
<Panel title="消费人次趋势">
|
||||||
<div v-if="data.payTypeRevenue.length" ref="mainRef" style="width: 100%;height: 100%"></div>
|
<template #tools>
|
||||||
|
<div class="time">
|
||||||
|
<div class="time_box"
|
||||||
|
v-for="(item,index) in weekAndMonth"
|
||||||
|
:key="index"
|
||||||
|
:class="{active:curCountDate?.name==item.name}"
|
||||||
|
@click="changeCountDate(item)"
|
||||||
|
>
|
||||||
|
<span>{{ item.name }}</span>
|
||||||
|
</div>
|
||||||
|
<el-date-picker
|
||||||
|
v-model="selectCountDate"
|
||||||
|
type="daterange"
|
||||||
|
@change="changeSelectCountDate"
|
||||||
|
range-separator="-"
|
||||||
|
start-placeholder="开始日期"
|
||||||
|
end-placeholder="结束日期"
|
||||||
|
style="margin-left: 24px"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<div v-if="data.payTypeRevenue.length" id="countChart" ref="mainRef" style="width: 100%;height: 100%"></div>
|
||||||
<el-empty v-else description="暂无数据"/>
|
<el-empty v-else description="暂无数据"/>
|
||||||
</Panel>
|
</Panel>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -128,6 +171,10 @@ const dataSelector = [
|
||||||
{name: '本周', func: getThisWeek()},
|
{name: '本周', func: getThisWeek()},
|
||||||
{name: '本月', func: getThisMonth()},
|
{name: '本月', func: getThisMonth()},
|
||||||
]
|
]
|
||||||
|
const weekAndMonth = [
|
||||||
|
{name: '本周', func: getThisWeek()},
|
||||||
|
{name: '本月', func: getThisMonth()},
|
||||||
|
]
|
||||||
const formatDate = (dateString: any) => {
|
const formatDate = (dateString: any) => {
|
||||||
const date = new Date(dateString);
|
const date = new Date(dateString);
|
||||||
const year = date.getFullYear();
|
const year = date.getFullYear();
|
||||||
|
|
@ -142,6 +189,8 @@ const chartRef = ref<HTMLElement | null>(null)
|
||||||
const mainRef = ref<HTMLElement | null>(null)
|
const mainRef = ref<HTMLElement | null>(null)
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
initChart()
|
initChart()
|
||||||
|
initIncomeChart()
|
||||||
|
initCountChart()
|
||||||
})
|
})
|
||||||
const getDateRange = () => {
|
const getDateRange = () => {
|
||||||
let beginTime = ''
|
let beginTime = ''
|
||||||
|
|
@ -155,8 +204,8 @@ const getDateRange = () => {
|
||||||
beginTime = date.start
|
beginTime = date.start
|
||||||
endTime = date.end
|
endTime = date.end
|
||||||
}
|
}
|
||||||
if (beginTime==endTime){
|
if (beginTime == endTime) {
|
||||||
endTime=getEndOfDay(endTime)
|
endTime = getEndOfDay(endTime)
|
||||||
}
|
}
|
||||||
return {begin: beginTime, end: endTime}
|
return {begin: beginTime, end: endTime}
|
||||||
}
|
}
|
||||||
|
|
@ -268,7 +317,7 @@ const initChart = () => {
|
||||||
trigger: 'axis'
|
trigger: 'axis'
|
||||||
},
|
},
|
||||||
legend: {
|
legend: {
|
||||||
data: ['患者', '普通',]
|
data: ['普通',]
|
||||||
},
|
},
|
||||||
grid: {
|
grid: {
|
||||||
left: '3%',
|
left: '3%',
|
||||||
|
|
@ -279,33 +328,17 @@ const initChart = () => {
|
||||||
xAxis: {
|
xAxis: {
|
||||||
type: 'category',
|
type: 'category',
|
||||||
boundaryGap: true,
|
boundaryGap: true,
|
||||||
data: [
|
data: incomeDateList.value
|
||||||
'2024-04-01',
|
|
||||||
'2024-03-30',
|
|
||||||
'2024-03-26',
|
|
||||||
'2024-03-22',
|
|
||||||
'2024-03-18',
|
|
||||||
'2024-03-14',
|
|
||||||
'2024-03-10',
|
|
||||||
'2024-03-06',
|
|
||||||
'2024-03-02',
|
|
||||||
]
|
|
||||||
},
|
},
|
||||||
yAxis: {
|
yAxis: {
|
||||||
type: 'value'
|
type: 'value'
|
||||||
},
|
},
|
||||||
series: [
|
series: [
|
||||||
{
|
|
||||||
name: '患者',
|
|
||||||
type: 'line',
|
|
||||||
stack: 'Total',
|
|
||||||
data: [120, 132, 101, 134, 90, 230, 210]
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
name: '普通',
|
name: '普通',
|
||||||
type: 'line',
|
type: 'line',
|
||||||
stack: 'Total',
|
stack: 'Total',
|
||||||
data: [220, 182, 191, 234, 290, 330, 310]
|
data: incomeCommonData.value
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
|
|
@ -319,14 +352,14 @@ const initChart = () => {
|
||||||
},
|
},
|
||||||
tooltip: {},
|
tooltip: {},
|
||||||
xAxis: {
|
xAxis: {
|
||||||
data: ['衬衫', '羊毛衫', '雪纺衫', '裤子', '高跟鞋', '袜子']
|
data: countDateList.value
|
||||||
},
|
},
|
||||||
yAxis: {},
|
yAxis: {},
|
||||||
series: [
|
series: [
|
||||||
{
|
{
|
||||||
name: '销量',
|
name: '销量',
|
||||||
type: 'bar',
|
type: 'bar',
|
||||||
data: [5, 20, 36, 10, 10, 20]
|
data: countDataList.value
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
});
|
});
|
||||||
|
|
@ -349,6 +382,134 @@ const changeCheckDate = (dateItem: any) => {
|
||||||
selectDate.value = null
|
selectDate.value = null
|
||||||
initChart()
|
initChart()
|
||||||
}
|
}
|
||||||
|
const incomeDateList = ref([
|
||||||
|
'2024-04-01',
|
||||||
|
'2024-03-30',
|
||||||
|
'2024-03-26',
|
||||||
|
'2024-03-22',
|
||||||
|
'2024-03-18',
|
||||||
|
])
|
||||||
|
const incomeCommonData = ref([220, 182, 191, 234, 290, 330, 310]);
|
||||||
|
const initIncomeChart = () => {
|
||||||
|
let date = {start: null, end: null}
|
||||||
|
if (curIncomeDate.value) {
|
||||||
|
date = curIncomeDate.value.func
|
||||||
|
}
|
||||||
|
if (selectIncomeDate.value) {
|
||||||
|
date.start = selectIncomeDate.value[0]
|
||||||
|
date.end = selectIncomeDate.value[1]
|
||||||
|
}
|
||||||
|
|
||||||
|
post("statistics/getPersonPayOverview", {beginTime: date.start, endTime: date.end}).then((res: any) => {
|
||||||
|
incomeDateList.value = res.dateList
|
||||||
|
incomeCommonData.value = res.commonPrice
|
||||||
|
const newChart = echarts.init(document.getElementById('incomeChart'));
|
||||||
|
newChart.setOption({
|
||||||
|
|
||||||
|
xAxis: {
|
||||||
|
type: 'category',
|
||||||
|
boundaryGap: true,
|
||||||
|
data: incomeDateList.value
|
||||||
|
},
|
||||||
|
yAxis: {
|
||||||
|
type: 'value'
|
||||||
|
},
|
||||||
|
series: [
|
||||||
|
{
|
||||||
|
name: '普通',
|
||||||
|
type: 'line',
|
||||||
|
stack: 'Total',
|
||||||
|
data: incomeCommonData.value
|
||||||
|
}
|
||||||
|
]
|
||||||
|
});
|
||||||
|
})
|
||||||
|
|
||||||
|
}
|
||||||
|
const curIncomeDate = ref<any>(weekAndMonth[0]);
|
||||||
|
const selectIncomeDate = ref();
|
||||||
|
const changeIncomeDate = (dateItem: any) => {
|
||||||
|
curIncomeDate.value = dateItem
|
||||||
|
selectIncomeDate.value = null
|
||||||
|
initIncomeChart()
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
const changeSelectIncomeDate = (date: any) => {
|
||||||
|
curIncomeDate.value = null
|
||||||
|
selectIncomeDate.value = date
|
||||||
|
let temp = formatDateArray(date)
|
||||||
|
selectIncomeDate.value[0] = temp[0]
|
||||||
|
selectIncomeDate.value[1] = getEndOfDay(temp[1])
|
||||||
|
|
||||||
|
initIncomeChart()
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
const curCountDate = ref<any>(weekAndMonth[0]);
|
||||||
|
const selectCountDate = ref();
|
||||||
|
const changeCountDate = (dateItem: any) => {
|
||||||
|
curCountDate.value = dateItem
|
||||||
|
selectCountDate.value = null
|
||||||
|
initCountChart()
|
||||||
|
|
||||||
|
}
|
||||||
|
const countDateList = ref([
|
||||||
|
'2024-04-01',
|
||||||
|
'2024-03-30',
|
||||||
|
'2024-03-26',
|
||||||
|
'2024-03-22',
|
||||||
|
'2024-03-18',
|
||||||
|
'2024-03-14',
|
||||||
|
'2024-03-10',
|
||||||
|
'2024-03-06',
|
||||||
|
'2024-03-02',
|
||||||
|
])
|
||||||
|
const countDataList = ref([5, 20, 36, 10, 10, 20])
|
||||||
|
const changeSelectCountDate = (date: any) => {
|
||||||
|
curCountDate.value = null
|
||||||
|
selectCountDate.value = date
|
||||||
|
let temp = formatDateArray(date)
|
||||||
|
selectCountDate.value[0] = temp[0]
|
||||||
|
selectCountDate.value[1] = getEndOfDay(temp[1])
|
||||||
|
|
||||||
|
initCountChart()
|
||||||
|
}
|
||||||
|
const initCountChart = () => {
|
||||||
|
let date = {start: null, end: null}
|
||||||
|
if (curCountDate.value) {
|
||||||
|
date = curCountDate.value.func
|
||||||
|
}
|
||||||
|
if (selectCountDate.value) {
|
||||||
|
date.start = selectCountDate.value[0]
|
||||||
|
date.end = selectCountDate.value[1]
|
||||||
|
}
|
||||||
|
|
||||||
|
post("statistics/getSalesVolumeOverview", {beginTime: date.start, endTime: date.end}).then((res: any) => {
|
||||||
|
countDateList.value = res.dateList
|
||||||
|
countDataList.value = res.countList
|
||||||
|
const newChart = echarts.init(document.getElementById('countChart'));
|
||||||
|
newChart.setOption({
|
||||||
|
|
||||||
|
xAxis: {
|
||||||
|
data: countDateList.value
|
||||||
|
},
|
||||||
|
|
||||||
|
yAxis: {
|
||||||
|
},
|
||||||
|
series: [
|
||||||
|
{
|
||||||
|
name: '销量',
|
||||||
|
type: 'bar',
|
||||||
|
data: countDataList.value
|
||||||
|
}
|
||||||
|
]
|
||||||
|
});
|
||||||
|
})
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
|
|
@ -365,6 +526,7 @@ const changeCheckDate = (dateItem: any) => {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
color: #fff;
|
color: #fff;
|
||||||
background: #409EFF;
|
background: #409EFF;
|
||||||
|
|
@ -372,10 +534,12 @@ const changeCheckDate = (dateItem: any) => {
|
||||||
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.active{
|
|
||||||
|
.active {
|
||||||
color: #fff !important;
|
color: #fff !important;
|
||||||
background: #409EFF;
|
background: #409EFF;
|
||||||
}
|
}
|
||||||
|
|
||||||
.container {
|
.container {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
|
|
||||||
|
|
@ -55,8 +55,13 @@
|
||||||
</div>
|
</div>
|
||||||
</el-scrollbar>
|
</el-scrollbar>
|
||||||
<div class="bottom">
|
<div class="bottom">
|
||||||
<TotalPrice v-model="formData.totalPrice" @save="charge" :status="formData.status ==0" @openSettlement="charge"
|
<TotalPrice v-model="formData.totalPrice"
|
||||||
@openCheckOut="openCheckoutDetail(formData.goodsDetail,formData.patientRegistration.psnNo)"></TotalPrice>
|
@save="charge"
|
||||||
|
:status="formData.status ==0"
|
||||||
|
@openSettlement="charge"
|
||||||
|
@openCheckOut="openCheckoutDetail(formData.goodsDetail,formData.patientRegistration.psnNo)"
|
||||||
|
|
||||||
|
></TotalPrice>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="right">
|
<div class="right">
|
||||||
|
|
@ -338,6 +343,7 @@ const getStatus = (status: any) => {
|
||||||
patientRegistration: {}
|
patientRegistration: {}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue