czg_team
/
management
7
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

挂账相关更新

This commit is contained in:
GaoHao 2024-11-23 18:06:24 +08:00
parent fe4d54440e
commit c623a510ef
8 changed files with 771 additions and 225 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
src/api/credit.js
View File

@ -39,14 +39,13 @@ export function addCreditBuyer(data) {
}
/**
* 删除优惠券
* 删除挂账人
* @returns
*/
export function delTbShopCoupon(params) {
export function delCreditBuyer(id) {
return request({
url: '/api/tbShopCoupon',
method: 'delete',
data: params
url: `/api/credit/buyer/${id}`,
method: 'delete'
})
}

7
src/router/routers.js
View File

@ -65,6 +65,13 @@ export const constantRouterMap = [
name: 'data_credit',
meta: { title: '挂账管理' }
},
{
path: 'data_creditDetail',
component: (resolve) => require(['@/views/home/data_creditDetail'], resolve),
name: 'data_creditDetail',
hidden: true,
meta: { title: '挂账明细' }
},
{
path: 'data_record',
component: (resolve) => require(['@/views/home/data_record'], resolve),

1
src/views/coupon_manage/add_coupon.vue
View File

@ -320,7 +320,6 @@ export default {
* @param item
*/
tabClick(item) {
console.log(this.form)
this.form = this.resetForm
this.form.number = ''
this.form.type = item.type

203
src/views/home/components/credit_RePaymentRecord.vue Normal file
View File

@ -0,0 +1,203 @@
<template>
<div>
<el-dialog title="账单还款记录" :visible.sync="dialogVisible" width="70%" @close="reset">
<div class="search">
<el-form :model="query" inline label-position="left">
<el-form-item>
<el-input v-model="query.value" placeholder="支付方式" style="" />
</el-form-item>
<el-form-item>
<el-button @click="reset">重置</el-button>
<el-button type="primary" @click="getTableData">查询</el-button>
</el-form-item>
</el-form>
</div>
<div class="head-container">
<el-table v-loading="tableData.loading" :data="tableData.data">
<el-table-column label="支付方式" prpo="name">
<template v-slot="scope"> <div>{{ scope.row.name ? scope.row.name : '-' }}</div> </template>
</el-table-column>
<el-table-column label="支付金额" prpo="name">
<template v-slot="scope"> <div>{{ scope.row.name ? scope.row.name : '-' }}</div> </template>
</el-table-column>
<el-table-column label="备注" prpo="name">
<template v-slot="scope"> <div>{{ scope.row.name ? scope.row.name : '-' }}</div> </template>
</el-table-column>
<el-table-column label="操作时间" prop="receiveTime" />
</el-table>
</div>
<div class="head-container">
<el-pagination
:total="tableData.total"
:current-page="query.page"
:page-size="query.size"
layout="total, sizes, prev, pager, next, jumper"
@current-change="paginationChange"
@size-change="sizeChange"
/>
</div>
</el-dialog>
</div>
</template>
<script>
import { queryReceive } from '@/api/coupon'
export default {
data() {
return {
dialogVisible: false,
stateList: [
{ label: '未使用', value: 0 },
{ label: '已使用', value: 1 }
],
query: {
couponId: '',
value: '',
status: 0,
page: 1,
size: 10
},
resetQuery: null,
tableData: {
data: [],
loading: false,
total: 0
}
}
},
mounted() {
this.resetQuery = { ...this.query }
},
methods: {
/**
* 查询
*/
async getTableData() {
// eslint-disable-next-line no-unused-vars, prefer-const
let res = await queryReceive({
shopId: localStorage.getItem('shopId'),
value: this.query.value,
page: this.query.page,
size: this.query.size
})
this.tableData.loading = false
this.tableData.data = res.content
this.tableData.total = res.totalElements
},
/**
* 打开
* @param row
*/
show(row) {
this.dialogVisible = true
this.query.couponId = row.id
this.getTableData()
},
/**
* 分页大小改变
* @param e
*/
sizeChange(e) {
this.query.size = e
this.getTableData()
},
/**
* 分页回调
* @param e
*/
paginationChange(e) {
this.query.page = e
this.getTableData()
},
/**
* 关闭
*/
close() {
this.dialogVisible = false
},
/**
* 重置
*/
reset() {
this.query = { ...this.resetQuery }
this.getTableData()
}
}
}
</script>
<style scoped lang="scss">
.shop_list {
display: flex;
flex-wrap: wrap;
.item_wrap {
$size: 80px;
.item {
$radius: 4px;
width: $size;
height: $size;
border-radius: $radius;
overflow: hidden;
position: relative;
margin-right: 10px;
margin-top: 10px;
&:hover {
cursor: pointer;
}
&::after {
content: attr(data-index);
font-size: 12px;
height: 20px;
display: flex;
padding: 0 10px;
border-radius: 0 0 $radius 0;
align-items: center;
background-color: rgba(0, 0, 0, 0.3);
backdrop-filter: blur(10px);
color: #fff;
position: absolute;
top: 0;
left: 0;
z-index: 10;
}
&::before {
content: '删除';
font-size: 12px;
width: 100%;
height: 20px;
display: flex;
padding: 0 10px;
align-items: center;
justify-content: center;
background-color: rgba(0, 0, 0, 0.3);
backdrop-filter: blur(10px);
color: #fff;
position: absolute;
bottom: 0;
left: 0;
z-index: 10;
transition: all .1s ease-in-out;
}
}
.name {
width: $size;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
}
}
</style>

116
src/views/home/components/credit_add.vue
View File

@ -1,18 +1,19 @@
<template>
<div>
<el-dialog
title="创建挂账人"
:visible.sync="addDialogVisible"
:show-close="false"
:visible.sync="dialogVisible"
width="30%"
center
>
<div slot="title" class="dialog-title">{{ form.id?'编辑':'创建' }}挂账人</div>
<div class="content">
<el-form ref="form" :model="form" :rules="rules" label-width="120px" label-position="left">
<el-form-item label="状态" prop="status" style="width: 100%;">
<el-switch
v-model="form.status"
active-value="1"
inactive-value="0"
:active-value="1"
:inactive-value="0"
/>
</el-form-item>
<el-form-item label="挂账人" prop="debtor" style="width: 100%;">
@ -40,7 +41,7 @@
</el-form>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="addDialogVisible = false">取 消</el-button>
<el-button @click="dialogVisible = false">取 消</el-button>
<el-button type="primary" :loading="loading" @click="onSubmitHandle">确 定</el-button>
</span>
</el-dialog>
@ -48,14 +49,14 @@
</template>
<script>
import { addCreditBuyer } from '@/api/coupon'
import { addCreditBuyer } from '@/api/credit'
export default {
// eslint-disable-next-line vue/require-prop-types
props: ['couponId'],
data() {
return {
addDialogVisible: false,
dialogVisible: false,
loading: false,
repaymentMethodList: [
{ label: '按总金额还款', value: 'total' },
@ -64,7 +65,7 @@ export default {
form: {
id: '',
shopId: '',
status: '1',
status: 0,
debtor: '',
mobile: '',
position: '',
@ -100,11 +101,13 @@ export default {
trigger: 'blur'
}
]
}
},
resetForm: null
}
},
mounted() {
this.resetForm = { ...this.form }
},
methods: {
/**
@ -134,11 +137,11 @@ export default {
message: `${this.form.id ? '编辑' : '添加'}成功`,
type: 'success'
})
this.addDialogVisible = false
this.dialogVisible = false
this.loading = false
this.$emit('success', res)
} catch (error) {
this.loading = false
console.log(error)
}
}
})
@ -146,93 +149,32 @@ export default {
/**
* 打开详情
* @param obj
* @param row
*/
show(obj) {
console.log(obj)
this.addDialogVisible = true
this.getTableData()
show(row) {
if (row && row.id) {
this.form = row
} else {
this.form = this.resetForm
}
this.form.status = Number(this.form.status)
this.dialogVisible = true
this.$refs.form.resetFields()
},
/**
* 关闭
*/
close() {
this.addDialogVisible = false
},
reset() {
this.query = { ...this.resetQuery }
this.dialogVisible = false
}
}
}
</script>
<style scoped lang="scss">
.shop_list {
display: flex;
flex-wrap: wrap;
.item_wrap {
$size: 80px;
.item {
$radius: 4px;
width: $size;
height: $size;
border-radius: $radius;
overflow: hidden;
position: relative;
margin-right: 10px;
margin-top: 10px;
&:hover {
cursor: pointer;
}
&::after {
content: attr(data-index);
font-size: 12px;
height: 20px;
display: flex;
padding: 0 10px;
border-radius: 0 0 $radius 0;
align-items: center;
background-color: rgba(0, 0, 0, 0.3);
backdrop-filter: blur(10px);
color: #fff;
position: absolute;
top: 0;
left: 0;
z-index: 10;
}
&::before {
content: '删除';
font-size: 12px;
width: 100%;
height: 20px;
display: flex;
padding: 0 10px;
align-items: center;
justify-content: center;
background-color: rgba(0, 0, 0, 0.3);
backdrop-filter: blur(10px);
color: #fff;
position: absolute;
bottom: 0;
left: 0;
z-index: 10;
transition: all .1s ease-in-out;
}
}
.name {
width: $size;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
}
.dialog-title{
text-align: left;
}
</style>

151
src/views/home/components/credit_repayment.vue
View File

@ -1,20 +1,26 @@
<!-- eslint-disable vue/no-use-v-if-with-v-for -->
<template>
<div>
<el-dialog
title="挂账还款"
:visible.sync="addDialogVisible"
:show-close="false"
:visible.sync="dialogVisible"
width="30%"
center
>
<div slot="title" class="dialog-title">挂账还款</div>
<div class="content">
<div class="credit_info">
<div>挂账人：{{ form.debtor }}</div>
<div>挂账金额：￥{{ form.owedAmount || 0 }}</div>
<div>账户余额: ￥{{ form.accountBalance || 0 }}</div>
</div>
<el-form ref="form" :model="form" :rules="rules" label-width="120px" label-position="left">
<el-form-item label="还款方式" style="width: 100%;">
<el-radio-group v-model="form.repaymentMethod" :disabled="isExist(form.id)">
<el-radio v-for="item in repaymentMethodList" :key="item.value" :label="item.value">
<el-radio-group v-model="form.repaymentMethod">
<el-radio v-for="item in repaymentMethodList" v-if="form.repaymentMethod == item.value" :key="item.value" :label="item.value">
{{ item.label }}
</el-radio>
</el-radio-group>
<div style="font-size: 12px;color: #999;">一经创建无法更改还款方式</div>
</el-form-item>
<el-form-item label="还款金额" prop="creditAmount" style="width: 100%;">
<el-input v-model="form.creditAmount" placeholder="" oninput="value= value.replace(/[^\d|\.]/g, '')">
@ -24,21 +30,13 @@
<el-form-item label="支付方式" prop="debtor" style="width: 100%;">
<el-input v-model="form.debtor" placeholder="请输入支付方式" />
</el-form-item>
<el-form-item label="备注" prop="debtor" style="width: 100%;">
<el-input v-model="form.debtor" placeholder="请输入备注" />
</el-form-item>
<el-form-item label="还款方式" style="width: 100%;">
<el-radio-group v-model="form.repaymentMethod" :disabled="isExist(form.id)">
<el-radio v-for="item in repaymentMethodList" :key="item.value" :label="item.value">
{{ item.label }}
</el-radio>
</el-radio-group>
<div style="font-size: 12px;color: #999;">一经创建无法更改还款方式</div>
<el-form-item label="备注" prop="remark" style="width: 100%;">
<el-input v-model="form.remark" placeholder="请输入备注" />
</el-form-item>
</el-form>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="addDialogVisible = false">取 消</el-button>
<el-button @click="dialogVisible = false">取 消</el-button>
<el-button type="primary" :loading="loading" @click="onSubmitHandle">确 定</el-button>
</span>
</el-dialog>
@ -53,7 +51,7 @@ export default {
props: ['couponId'],
data() {
return {
addDialogVisible: false,
dialogVisible: false,
loading: false,
repaymentMethodList: [
{ label: '按总金额还款', value: 'total' },
@ -67,34 +65,20 @@ export default {
mobile: '',
position: '',
creditAmount: '',
repaymentMethod: 'total'
repaymentMethod: ''
},
rules: {
debtor: [
{
required: true,
message: '请输入挂账人名称',
message: '请输入还款金额',
trigger: 'blur'
}
],
mobile: [
{
required: true,
message: '请输入手机号',
trigger: 'blur'
}
],
position: [
{
required: true,
message: '请输入职位',
trigger: 'blur'
}
],
creditAmount: [
{
required: true,
message: '请输入挂账额度',
message: '请输入支付方式',
trigger: 'blur'
}
]
@ -132,7 +116,7 @@ export default {
message: `${this.form.id ? '编辑' : '添加'}成功`,
type: 'success'
})
this.addDialogVisible = false
this.dialogVisible = false
this.loading = false
} catch (error) {
this.loading = false
@ -143,20 +127,19 @@ export default {
},
/**
* 打开详情
* @param obj
* 打开
* @param row
*/
show(obj) {
console.log(obj)
this.addDialogVisible = true
this.getTableData()
show(row) {
this.form = row
this.dialogVisible = true
},
/**
* 关闭
*/
close() {
this.addDialogVisible = false
this.dialogVisible = false
},
reset() {
@ -167,70 +150,24 @@ export default {
</script>
<style scoped lang="scss">
.shop_list {
display: flex;
flex-wrap: wrap;
.item_wrap {
$size: 80px;
.item {
$radius: 4px;
width: $size;
height: $size;
border-radius: $radius;
overflow: hidden;
position: relative;
margin-right: 10px;
margin-top: 10px;
&:hover {
cursor: pointer;
}
&::after {
content: attr(data-index);
font-size: 12px;
height: 20px;
display: flex;
padding: 0 10px;
border-radius: 0 0 $radius 0;
align-items: center;
background-color: rgba(0, 0, 0, 0.3);
backdrop-filter: blur(10px);
color: #fff;
position: absolute;
top: 0;
left: 0;
z-index: 10;
}
&::before {
content: '删除';
font-size: 12px;
width: 100%;
height: 20px;
display: flex;
padding: 0 10px;
align-items: center;
justify-content: center;
background-color: rgba(0, 0, 0, 0.3);
backdrop-filter: blur(10px);
color: #fff;
position: absolute;
bottom: 0;
left: 0;
z-index: 10;
transition: all .1s ease-in-out;
}
}
.name {
width: $size;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
}
.credit_info{
width: 100%;
background: #F7F7FA;
border-radius: 3px 3px 3px 3px;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
padding: 15px 25px;
box-sizing: border-box;
margin-bottom: 30px;
view{
font-weight: 400;
font-size: 14px;
color: #000000;
}
}
.dialog-title{
text-align: left;
}
</style>

63
src/views/home/data_credit.vue
View File

@ -1,11 +1,8 @@
<template>
<div class="app-container">
<div class="head-container title">
挂账管理
</div>
<div class="head-container filtration">
<div class="l">
<el-button type="primary" icon="el-icon-plus" @click="addCredit">
<el-button type="primary" icon="el-icon-plus" @click="openDialog(null,'add')">
创建挂账人
</el-button>
</div>
@ -19,12 +16,15 @@
:value="item.value"
/>
</el-select>
<el-button type="primary" @click="getTableData()">
查询
</el-button>
</div>
</div>
<div class="content">
<div class="head-container content">
<el-table v-loading="tableData.loading" :data="tableData.data">
<el-table-column label="挂账编码" prop="id" />
<el-table-column label="状态">
<el-table-column label="状态" width="90">
<template v-slot="scope">
{{ scope.row.status == '1' ? '启用' : '停用' }}
</template>
@ -34,20 +34,19 @@
<el-table-column label="挂账额度(元)" prop="creditAmount" />
<el-table-column label="已挂账金额(元)" prop="owedAmount" />
<el-table-column label="剩余挂账额度(元)" prop="remainingAmount" />
<!-- <el-table-column label="账户余额" prop="title" /> -->
<el-table-column label="账户余额" prop="accountBalance" />
<el-table-column label="适用门店" prop="shopName" />
<el-table-column label="操作" width="150">
<el-table-column label="操作" width="300">
<template v-slot="scope">
<el-button type="text" icon="el-icon-edit" @click="$router.push({name: 'add_coupon', query: {type:scope.row.type ,id: scope.row.id}} )">查看明细</el-button>
<el-button type="text" icon="el-icon-edit" @click="$router.push({name: 'add_coupon', query: {type:scope.row.type ,id: scope.row.id}} )">编辑</el-button>
<el-button type="text" icon="el-icon-edit" @click="$router.push({name: 'add_coupon', query: {type:scope.row.type ,id: scope.row.id}} )">还款</el-button>
<el-button type="text" icon="el-icon-edit" @click="$router.push({name: 'add_coupon', query: {type:scope.row.type ,id: scope.row.id}} )">还款记录</el-button>
<el-button type="text" icon="el-icon-edit" @click="$router.push({name: 'data_creditDetail', query: {id: scope.row.id}} )">查看明细</el-button>
<el-button type="text" icon="el-icon-edit" @click="openDialog(scope.row,'edit')">编辑</el-button>
<el-button type="text" icon="el-icon-edit" @click="openDialog(scope.row,'repayment')">还款</el-button>
<el-button type="text" icon="el-icon-edit" @click="openDialog(scope.row,'rePaymentRecord')">还款记录</el-button>
<el-popconfirm title="确定删除吗？" @confirm="delTableHandle([scope.row.id])">
<el-button
slot="reference"
type="text"
icon="el-icon-delete"
style="margin-left: 20px !important;"
>删除</el-button>
</el-popconfirm>
</template>
@ -66,10 +65,13 @@
</div>
<!-- 创建挂账人 -->
<creditAdd ref="creditAdd" />
<creditAdd ref="creditAdd" @success="resetHandle" />
<!-- 还款 -->
<creditRepayment ref="creditRepayment" />
<creditRepayment ref="creditRepayment" @success="resetHandle" />
<!-- 还款记录 -->
<creditRepaymentRecord ref="creditRepaymentRecord" @success="resetHandle" />
</div>
</template>
@ -77,10 +79,11 @@
<script>
import creditAdd from './components/credit_add.vue'
import creditRepayment from './components/credit_repayment.vue'
import { getTbShopCoupon, delTbShopCoupon } from '@/api/credit'
import creditRepaymentRecord from './components/credit_RePaymentRecord.vue'
import { getTbShopCoupon, delCreditBuyer } from '@/api/credit'
export default {
// eslint-disable-next-line vue/no-unused-components
components: { creditAdd, creditRepayment },
components: { creditAdd, creditRepayment, creditRepaymentRecord },
filters: {
typeFilter(value) {
@ -94,12 +97,12 @@ export default {
return {
options: [
{
value: '启用',
label: '1'
value: '1',
label: '启用'
},
{
value: '停用',
label: '0'
value: '0',
label: '停用'
}
],
tableData: {
@ -121,13 +124,21 @@ export default {
/**
* 创建挂账人
*/
addCredit() {
// this.$refs.creditAdd.show()
this.$refs.creditRepayment.show()
openDialog(row, type) {
if (type === 'add') {
this.$refs.creditAdd.show()
} else if (type === 'edit') {
this.$refs.creditAdd.show(row)
} else if (type === 'repayment') {
this.$refs.creditRepayment.show(row)
} else if (type === 'rePaymentRecord') {
this.$refs.creditRepaymentRecord.show(row)
}
},
// 重置查询
resetHandle() {
console.log(123123)
this.page = 1
this.getTableData()
},
@ -149,6 +160,8 @@ export default {
const res = await getTbShopCoupon({
page: this.tableData.page,
size: this.tableData.size,
keywords: this.tableData.keywords,
status: this.tableData.status,
shopId: localStorage.getItem('shopId')
})
this.tableData.loading = false
@ -173,7 +186,7 @@ export default {
* @param id
*/
async delTableHandle(id) {
const delRes = await delTbShopCoupon(id)
const delRes = await delCreditBuyer(id)
console.log(delRes)
this.getTableData()
}

446
src/views/home/data_creditDetail.vue Normal file
View File

@ -0,0 +1,446 @@
<template>
<div class="app-container">
<div class="head-container">
<el-form :model="query" inline label-position="left">
<el-form-item>
<el-radio-group v-model="timeValue" @change="timeChange">
<el-radio-button label="">全部</el-radio-button>
<el-radio-button label="0">今天</el-radio-button>
<el-radio-button label="-1">昨天</el-radio-button>
<el-radio-button label="-7">最近7天</el-radio-button>
<el-radio-button label="-30">最近30天</el-radio-button>
<el-radio-button label="week">本周</el-radio-button>
<el-radio-button label="month">本月</el-radio-button>
<el-radio-button label="custom">自定义</el-radio-button>
</el-radio-group>
<el-date-picker
v-if="timeValue == 'custom'"
v-model="query.createdAt"
type="daterange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
:default-time="['00:00:00', '23:59:59']"
value-format="yyyy-MM-dd HH:mm:ss"
/>
</el-form-item>
<template>
<el-form-item>
<el-input v-model="query.proName" placeholder="商品名称" />
</el-form-item>
<el-form-item>
<el-select v-model="query.cateId" placeholder="全部状态" style="width: 140px;">
<el-option v-for="item in categorys" :key="item.id" :label="item.name" :value="item.id" />
</el-select>
</el-form-item>
</template>
<el-form-item>
<el-button type="primary" @click="getTableData">查询</el-button>
<el-button @click="resetHandle">重置</el-button>
</el-form-item>
</el-form>
</div>
<div class="head-container">
<div class="collect_wrap">
<div v-for="item in payCountList" :key="item.id" class="item">
<div class="icon_wrap" style="--bg-color:#C978EE">
<i class="icon" :class="item.icon" />
</div>
<div class="info">
<div class="m">
<template v-if="item.isAmount == 1">￥</template>
{{ item.payAmount }}
</div>
<div class="t">{{ item.payType }}</div>
</div>
</div>
</div>
</div>
<div class="head-container">
<el-table v-loading="tableData.loading" :data="tableData.data">
<el-table-column label="创建日期" prop="name" />
<el-table-column label="订单号" prop="name" />
<el-table-column label="应付金额" prop="salesAmount">
<template v-slot="scope"> ￥{{ scope.row.salesAmount }} </template>
</el-table-column>
<el-table-column label="已付款金额" prop="salesAmount">
<template v-slot="scope"> ￥{{ scope.row.salesAmount }} </template>
</el-table-column>
<el-table-column label="待付款金额" prop="salesAmount">
<template v-slot="scope"> ￥{{ scope.row.salesAmount }} </template>
</el-table-column>
<el-table-column label="状态" prop="salesAmount">
<template v-slot="scope">
￥{{ scope.row.salesAmount }}
</template>
</el-table-column>
<el-table-column label="付款方式" prop="salesAmount">
<template v-slot="scope"> ￥{{ scope.row.salesAmount }} </template>
</el-table-column>
<el-table-column label="备注" prop="salesAmount">
<template v-slot="scope"> ￥{{ scope.row.salesAmount }} </template>
</el-table-column>
<el-table-column label="付款时间" prop="name" />
<el-table-column label="操作" width="350">
<template v-slot="scope">
<el-button type="text" icon="el-icon-edit" @click="addCredit(scope.row,'repayment')">付款</el-button>
<el-button type="text" icon="el-icon-edit" @click="addCredit(scope.row,'edit')">账单付款记录</el-button>
</template>
</el-table-column>
</el-table>
</div>
<div class="head-container">
<el-pagination
:total="tableData.total"
:current-page="tableData.page"
:page-size="tableData.size"
layout="total, sizes, prev, pager, next, jumper"
@current-change="paginationChange"
@size-change="sizeChange"
/>
</div>
</div>
</template>
<script>
import { daycount, summaryday } from '@/api/home'
import { tbShopCategoryGet } from '@/api/shop'
import dayjs from 'dayjs'
export default {
filters: {
},
data() {
return {
timeValue: '',
resetQuery: null,
categorys: [],
query: {
createdAt: [],
proName: '',
cateId: ''
},
tableData: {
data: [],
page: 1,
size: 10,
loading: false,
total: 0
},
downloadLoading: false,
payCountList: '',
payCountTotal: 0
}
},
mounted() {
this.resetQuery = { ...this.query }
this.getTableData()
this.tbShopCategoryGet()
},
methods: {
/**
* 获取明细数据
*/
async getTableData() {
this.tableData.loading = true
try {
this.daycount()
const res = await summaryday({
page: this.tableData.page,
size: this.tableData.size,
startTime: this.query.createdAt[0],
endTime: this.query.createdAt[1],
proName: this.query.proName,
cateId: this.query.cateId
})
this.tableData.loading = false
this.tableData.data = res.content
this.tableData.total = res.totalElements
} catch (error) {
console.log(error)
}
},
/**
* 切换时间
* @param e
*/
timeChange(e) {
const format = ['YYYY-MM-DD 00:00:00', 'YYYY-MM-DD 23:59:59']
switch (e) {
case '':
// 全部
this.query.createdAt = []
break
case '0':
// 今天
this.query.createdAt = [
dayjs().format(format[0]),
dayjs().format(format[1])
]
break
case '-1':
// 昨天
this.query.createdAt = [
dayjs()
.add(-1, 'd')
.format(format[0]),
dayjs()
.add(-1, 'd')
.format(format[1])
]
break
case '-7':
// 最近7天
this.query.createdAt = [
dayjs()
.add(-7, 'd')
.format(format[0]),
dayjs().format(format[1])
]
break
case '-30':
// 最近7天
this.query.createdAt = [
dayjs()
.add(-30, 'd')
.format(format[0]),
dayjs().format(format[1])
]
break
case 'week':
// 本周
this.query.createdAt = [
dayjs()
.startOf('week')
.format(format[0]),
dayjs()
.endOf('week')
.format(format[1])
]
break
case 'month':
// 本周
this.query.createdAt = [
dayjs()
.startOf('month')
.format(format[0]),
dayjs()
.endOf('month')
.format(format[1])
]
break
case 'custom':
// 自定义
this.query.createdAt = []
break
default:
break
}
console.log(this.timeValue)
},
/**
* 重置查询
*/
resetHandle() {
this.timeValue = ''
this.query = { ...this.resetQuery }
this.page = 1
this.getTableData()
},
/**
* 分页大小改变
* @param e
*/
sizeChange(e) {
this.tableData.size = e
this.getTableData()
},
/**
* 分页回调
* @param e
*/
paginationChange(e) {
this.tableData.page = e
this.getTableData()
},
// 获取商品分类
async tbShopCategoryGet() {
try {
const res = await tbShopCategoryGet({
page: 1,
size: 200,
sort: 'id,desc',
shopId: localStorage.getItem('shopId')
})
let categorys = []
for (let item of res.content) {
categorys.push({
name: `|----${item.name}`,
id: item.id
})
if (item.childrenList.length) {
for (let val of item.childrenList) {
categorys.push({
name: `|----|----${val.name}`,
id: val.id
})
}
}
}
this.categorys = categorys
} catch (error) {
console.log(error);
}
},
// 获取订单汇总
async daycount() {
try {
const res = await daycount({
startTime: this.query.createdAt[0],
endTime: this.query.createdAt[1],
cateId: this.query.cateId,
proName: this.query.proName,
type: this.orderType,
});
this.payCountList = res;
} catch (error) {
console.log(error);
}
}
}
};
</script>
<style scoped lang="scss">
.collect_wrap {
display: flex;
gap: 14px;
justify-content: space-between;
.item:nth-child(1) {
background-image: url(../../assets/images/home/data_forms4.png);
}
.item:nth-child(2) {
background-image: url(../../assets/images/home/data_forms3.png);
}
.item:nth-child(3) {
background-image: url(../../assets/images/home/data_forms2.png);
}
.item:nth-child(4) {
background-image: url(../../assets/images/home/data_forms1.png);
}
.item {
background-size: 100% 100%;
width: 255px;
display: flex;
align-items: center;
background-color: #f5f5f5;
padding: 20px;
.icon_wrap {
$size: 34px;
$border: 6px;
width: $size;
height: $size;
display: flex;
align-items: center;
justify-content: center;
background-color: var(--bg-color);
border-radius: 50%;
position: relative;
&::after {
content: "";
width: $size + $border;
height: $size + $border;
border-radius: 50%;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background-color: var(--bg-color);
opacity: 0.3;
}
.icon {
font-size: 16px;
color: #fff;
}
.img {
width: 20px;
height: 20px;
}
}
.info {
flex: 1;
display: flex;
flex-direction: column;
padding-left: 10px;
.m {
font-weight: bold;
}
.t {
font-size: 12px;
color: #999;
padding-top: 4px;
}
}
}
}
.refund {
color: #ff9731;
font-weight: bold;
}
.table_order_info {
.order_no {
color: #999;
}
.type {
color: #e6a23c;
}
}
.goods_info {
.row {
display: flex;
&:not(:first-child) {
margin-top: 10px;
}
.cover {
width: 40px;
height: 40px;
}
.info {
flex: 1;
display: flex;
flex-direction: column;
padding-left: 10px;
.sku {
color: #999;
}
}
}
}
</style>