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

完成会员

This commit is contained in:
魏啾 2024-03-01 20:26:44 +08:00
parent f8521dad84
commit c0caecf0fa
10 changed files with 849 additions and 291 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
index.html
View File

@ -4,6 +4,7 @@
<meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="Content-Security-Policy" content="default-src 'self' 'unsafe-inline';">
<title>Vite + Vue</title>
</head>
<body>

15
src/App.vue
View File

@ -94,11 +94,23 @@ html {
top: 10px !important;
}
.el-pagination {
justify-content: center;
}
.el-drawer__header {
// padding: 0 !important;
margin-bottom: 5px !important;
}
.el-table .warning-row {
--el-table-tr-bg-color: var(--el-color-warning-light-9);
}
.el-table .success-row {
--el-table-tr-bg-color: var(--el-color-success-light-9);
}
.el-drawer__body {
padding: 0 var(--el-drawer-padding-primary) !important;
@ -252,5 +264,4 @@ html {
transform: translateX(100%);
}
}
}
</style>
}</style>

31
src/api/member/index.js
View File

@ -12,4 +12,35 @@ export function queryMembermember(params) {
params
});
}
export function createMembermember(data) {
return request({
method: "post",
url: "member/createMember",
data
});
}
/**
* 查询会员流水
* @param {*} params
* @returns
*/
export function memberqueryMemberAccount(params) {
return request({
method: "get",
url: "member/queryMemberAccount",
params
});
}
/**
* 会员现金充值
* @param {*} params
* @returns
*/
export function accountPaymember(data) {
return request({
method: "post",
url: "member/accountPay",
data
});
}

282
src/components/cwx-keyboard/cwx-keyboard.vue Normal file
View File

@ -0,0 +1,282 @@
<template>
<div class='keyboard' @click.stop='_handleKeyPress'>
<div class='key-row'>
<div class='key-cell cell_b' data-num='7'>7</div>
<div class='key-cell cell_b' data-num='8'>8</div>
<div class='key-cell cell_b' data-num='9'>9</div>
<div class='key-cell cell_b' data-num='-1'></div>
</div>
<div class='key-row'>
<div class='key-cell cell_b' data-num='4'>4</div>
<div class='key-cell cell_b' data-num='5'>5</div>
<div class='key-cell cell_b' data-num='6'>6</div>
<div class='key-cell cell_b' data-num='-1'></div>
</div>
<div class='key-row'>
<div class='key-cell cell_b' data-num='1'>1</div>
<div class='key-cell cell_b' data-num='2'>2</div>
<div class='key-cell cell_b' data-num='3'>3</div>
<div class='key-cell cell_b' data-num='-1'></div>
</div>
<div class="key-zero-and-point">
<div class="a cell_b zero" data-num='0'>0</div>
<div class="a cell_b point" data-num='.'>.</div>
</div>
<div @touchstart="touchstart" @touchend="touchend" data-num='D' class="key-confirm2">
<text data-num='D'>C</text>
</div>
<div class='key-confirm' :style="{ 'background': btnColor }" data-num='S'>
<div data-num='S' class="">
<div data-num='S' class="title">{{ title }}</div>
</div>
</div>
</div>
</template>
<script setup>
import { ref, watch, reactive } from 'vue'
import { dayjs } from 'element-plus'
const props = defineProps({
title: {
default: '确认',
type: String
},
btnColor: {
default: 'green',
}
})
const emit = defineEmits(["consumeFee", "confirmEvent"])
const this_money = reactive({
money: '',
Cdel: '',
Time: ''
})
watch(() => this_money.money, (newval, oldval) => {
emit('consumeFee', newval)
});
const touchstart = () => {
this_money.Time = setInterval(() => {
console.log(this_money.money);
if (this_money.money == '') {
clearInterval();
}
this_money.money = this_money.money.substring(0, this_money.money.length - 1);
}, 200)
}
const touchend = () => {
clearInterval(this_money.Time);
}
//处理按键
const _handleKeyPress = (e) => {
let num = e.target.dataset.num;
//不同按键处理逻辑
// -1 代表无效按键，直接返回
if (num == -1) return false;
switch (String(num)) {
//小数点
case '.':
_handleDecimalPoint();
break;
//删除键
case 'D':
_handleDeleteKey();
break;
//清空键
case 'C':
_handleClearKey();
break;
//确认键
case 'S':
_handleConfirmKey();
break;
default:
_handleNumberKey(num);
break;
}
}
//处理小数点函数
const _handleDecimalPoint = () => {
//如果包含小数点，直接返回
if (this_money.money.indexOf('.') > -1) return false;
//如果小数点是第一位，补0
if (!this_money.money.length)
this_money.money = '0.';
//如果不是，添加一个小数点
else
this_money.money = this_money.money + '.';
}
//处理删除键
const _handleDeleteKey = () => {
let S = this_money.money;
//如果没有输入，直接返回
if (!S.length) return false;
//否则删除最后一个
this_money.money = S.substring(0, S.length - 1);
}
//处理清空键
const _handleClearKey = () => {
this_money.money = '';
}
//处理数字
const _handleNumberKey = (num) => {
if (this_money.money.length == 10) {
return
}
let S = this_money.money;
//如果有小数点且小数点位数不小于2
if (S.indexOf('.') > -1 && S.substring(S.indexOf('.') + 1).length < 2)
this_money.money = S + num;
//没有小数点
if (!(S.indexOf('.') > -1)) {
//如果第一位是0，只能输入小数点
if (num == 0 && S.length == 0)
this_money.money = '0.';
else {
if (S.length && Number(S.charAt(0)) === 0) return;
this_money.money = S + num;
}
}
}
//提交
const _handleConfirmKey = () => {
let S = this_money.money;
//未输入
if (!S.length || S == 0) {
uni.showToast({
title: '请输入正确的数值',
icon: 'none',
duration: 1000
});
return false;
}
//将 8. 这种转换成 8.00
if (S.indexOf('.') > -1 && S.indexOf('.') == (S.length - 1))
S = Number(S.substring(0, S.length - 1)).toFixed(2);
//保留两位
S = Number(S).toFixed(2);
emit('confirmEvent', S); //提交参数
}
</script>
<style lang="scss" scoped>
.cell_b {
border-right: 1px solid #d5d5d6;
border-bottom: 1px solid #d5d5d6;
}
.key-container {
width: 100%;
display: flex;
flex-direction: column;
}
.keyboard {
flex: 1;
position: relative;
bottom: 0;
left: 0;
height: 40vh;
width: 100%;
background: #FFFFFF;
}
.keyboard .key-row {
display: flex;
display: -webkit-flex;
position: relative;
height: 10vh;
line-height: 10vh;
}
.keyboard .key-cell {
flex: 1;
-webkit-box-flex: 1;
font-size: 60upx;
display: flex;
justify-content: center;
align-items: center;
}
.keyboard .key-confirm {
position: absolute;
text-align: center;
height: 30vh;
width: 25%;
line-height: 30vh;
color: #FFFFFF;
z-index: 5;
right: 0;
bottom: 0;
display: flex;
justify-content: center;
align-items: center;
}
.keyboard .key-confirm2 {
position: absolute;
height: 10vh;
width: 25%;
line-height: 10vh;
z-index: 9999;
right: 0;
top: 0;
display: flex;
justify-content: center;
align-items: center;
}
.key-zero-and-point {
display: flex;
height: 10vh;
justify-content: center;
align-items: center;
width: 75%;
font-size: 60upx;
.zero {
display: flex;
justify-content: center;
align-items: center;
width: 66.66%;
font-size: 60upx;
text-align: center;
height: 100%;
}
.point {
display: flex;
justify-content: center;
align-items: center;
width: 33.33%;
font-size: 60upx;
text-align: center;
height: 100%;
}
}
.key-cell:active {
color: white;
background: black; //黑色
opacity: 0.1; //这里重要，就是通过这个透明度来设置
}
.a:active,
.key-confirm2:active {
color: white;
background: black; //黑色
opacity: 0.1; //这里重要，就是通过这个透明度来设置
}
</style>

200
src/views/home/components/keyboard.vue Normal file
View File

@ -0,0 +1,200 @@
<template>
<div class="orderbox_right_inputkeyboard">
<div class='keyboard' @click.stop='_handleKeyPress'>
<div class='key-row'>
<el-button type="primary" plain class='key-cell cell_b' data-num='1'>1</el-button>
<el-button type="primary" plain class='key-cell cell_b' data-num='2'>2</el-button>
<el-button type="primary" plain class='key-cell cell_b' data-num='3'>3</el-button>
</div>
<div class='key-row'>
<el-button type="primary" plain class='key-cell cell_b' data-num='4'>4</el-button>
<el-button type="primary" plain class='key-cell cell_b' data-num='5'>5</el-button>
<el-button type="primary" plain class='key-cell cell_b' data-num='6'>6</el-button>
</div>
<div class='key-row'>
<el-button type="primary" plain class='key-cell cell_b' data-num='7'>7</el-button>
<el-button type="primary" plain class='key-cell cell_b' data-num='8'>8</el-button>
<el-button type="primary" plain class='key-cell cell_b' data-num='9'>9</el-button>
</div>
<div class='key-row'>
<el-button type="primary" plain class='key-cell cell_b' data-num='.'>.</el-button>
<el-button type="primary" plain class='key-cell cell_b' data-num='0'>0</el-button>
<el-button type="primary" plain class='key-cell cell_b' data-num='D'>c</el-button>
</div>
</div>
</div>
</template>
<script setup>
import { ref, reactive, watch } from 'vue'
import { useRoute } from "vue-router"
import { ElMessage } from 'element-plus'
import lodash_ from 'lodash'
const moneys = reactive({
money: ''
})
const emit = defineEmits(["consumeFees"])
watch(() => moneys.money, (newval, oldval) => {
console.log(newval)
emit('consumeFees', newval)
});
const _handleKeyPress = (e) => {
console.log('点击传e', e.target.dataset.num);
let num = e.target.dataset.num;
//不同按键处理逻辑
// -1 代表无效按键，直接返回
if (num == -1) return false;
switch (String(num)) {
//小数点
case '.':
_handleDecimalPoint();
break;
//删除键
case 'D':
_handleDeleteKey();
break;
default:
_handleNumberKey(num);
break;
}
}
//处理数字
const _handleNumberKey = (num) => {
if (num == undefined) {
return
}
if (moneys.money.length == 10) {
return
}
console.log(num, 247)
let S = moneys.money;
//如果有小数点且小数点位数不小于2
if (S.indexOf('.') > -1 && S.substring(S.indexOf('.') + 1).length < 2)
moneys.money = S + num;
//没有小数点
if (!(S.indexOf('.') > -1)) {
//如果第一位是0，只能输入小数点
if (num == 0 && S.length == 0)
moneys.money = '0.';
else {
if (S.length && Number(S.charAt(0)) === 0) return;
moneys.money = S + num;
}
}
}
//处理小数点函数
const _handleDecimalPoint = () => {
//如果包含小数点，直接返回
if (moneys.money.indexOf('.') > -1) return false;
//如果小数点是第一位，补0
if (!moneys.money.length) {
moneys.money = '0.';
} else {
//如果不是，添加一个小数点
moneys.money = moneys.money + '.';
}
}
//处理删除键
const _handleDeleteKey = () => {
let S = moneys.money;
//如果没有输入，直接返回
if (!S.length) return false;
//否则删除最后一个
moneys.money = S.substring(0, S.length - 1);
}
</script>
<style scoped lang="scss">
.orderbox_right_top {
color: #fff;
width: 100%;
background: #8b008b;
padding: 10px;
border-radius: 10px;
.orderbox_right_topdiv:nth-child(1) {
margin-top: 0px;
}
.orderbox_right_topdiv {
display: flex;
margin-top: 10px;
justify-content: space-between;
}
.orderbox_right_top_item {
position: relative;
background: #fff;
padding: 6px 10px;
display: flex;
margin-top: 10px;
border-radius: 10px;
justify-content: space-between;
align-items: center;
.orderbox_right_top_item_one {
display: flex;
align-items: center;
.orderbox_right_top_item_onespan {
color: black;
margin-left: 10px;
font-size: 16px;
}
}
.orderbox_right_top_item_tow {
color: black;
margin-left: 10px;
font-size: 14px;
font-weight: bold;
}
}
}
.orderbox_right_input {
width: 100%;
margin-top: 10px;
}
.orderbox_right_inputkeyboard {
margin-top: 20px;
.keyboard {
width: 100%;
background: #FFFFFF;
.key-row {
display: flex;
display: -webkit-flex;
position: relative;
height: 8vh;
line-height: 8vh;
}
}
.keyboard .key-cell {
flex: 1;
-webkit-box-flex: 1;
font-size: 30px;
display: flex;
justify-content: center;
align-items: center;
}
}
.orderbox_right_button {
position: absolute;
width: 90%;
left: 50%;
bottom: 16px;
display: flex;
justify-content: space-between;
align-items: center;
transform: translateX(-50%) !important;
}
</style>

55
src/views/home/components/member.vue
View File

@ -54,49 +54,37 @@
</div>
</div>
</div>
<div class="orderbox_right_input">
<keyboard ></keyboard>
<!-- <div class="orderbox_right_input">
<el-input placeholder="请输入会员手机号或者编号" v-model="moneys.money" clearable @input="inputChange"></el-input>
</div>
<div class="orderbox_right_inputkeyboard">
<div class='keyboard'>
<div class='keyboard' @click.stop='_handleKeyPress'>
<div class='key-row'>
<el-button type="primary" @click.stop='_handleKeyPress' plain class='key-cell cell_b'
data-num='1'>1</el-button>
<el-button type="primary" @click.stop='_handleKeyPress' plain class='key-cell cell_b'
data-num='2'>2</el-button>
<el-button type="primary" @click.stop='_handleKeyPress' plain class='key-cell cell_b'
data-num='3'>3</el-button>
<el-button type="primary" plain class='key-cell cell_b' data-num='1'>1</el-button>
<el-button type="primary" plain class='key-cell cell_b' data-num='2'>2</el-button>
<el-button type="primary" plain class='key-cell cell_b' data-num='3'>3</el-button>
</div>
<div class='key-row'>
<el-button type="primary" @click.stop='_handleKeyPress' plain class='key-cell cell_b'
data-num='4'>4</el-button>
<el-button type="primary" @click.stop='_handleKeyPress' plain class='key-cell cell_b'
data-num='5'>5</el-button>
<el-button type="primary" @click.stop='_handleKeyPress' plain class='key-cell cell_b'
data-num='6'>6</el-button>
<el-button type="primary" plain class='key-cell cell_b' data-num='4'>4</el-button>
<el-button type="primary" plain class='key-cell cell_b' data-num='5'>5</el-button>
<el-button type="primary" plain class='key-cell cell_b' data-num='6'>6</el-button>
</div>
<div class='key-row'>
<el-button type="primary" @click.stop='_handleKeyPress' plain class='key-cell cell_b'
data-num='7'>7</el-button>
<el-button type="primary" @click.stop='_handleKeyPress' plain class='key-cell cell_b'
data-num='8'>8</el-button>
<el-button type="primary" @click.stop='_handleKeyPress' plain class='key-cell cell_b'
data-num='9'>9</el-button>
<el-button type="primary" plain class='key-cell cell_b' data-num='7'>7</el-button>
<el-button type="primary" plain class='key-cell cell_b' data-num='8'>8</el-button>
<el-button type="primary" plain class='key-cell cell_b' data-num='9'>9</el-button>
</div>
<div class='key-row'>
<el-button type="primary" @click.stop='_handleKeyPress' plain class='key-cell cell_b'
data-num='.'>.</el-button>
<el-button type="primary" @click.stop='_handleKeyPress' plain class='key-cell cell_b'
data-num='0'>0</el-button>
<el-button type="primary" @click.stop='_handleKeyPress' plain class='key-cell cell_b'
data-num='D'>c</el-button>
<el-button type="primary" plain class='key-cell cell_b' data-num='.'>.</el-button>
<el-button type="primary" plain class='key-cell cell_b' data-num='0'>0</el-button>
<el-button type="primary" plain class='key-cell cell_b' data-num='D'>c</el-button>
</div>
</div>
</div>
</div> -->
<div class="orderbox_right_button">
<el-button style="width: 35%;" @click="recharge = true">添加会员</el-button>
<el-button style="width: 60%;" type="primary"
@click="onSubmit">确认</el-button>
<el-button style="width: 35%;" @click="recharge = true">添加会员</el-button>
<el-button style="width: 60%;" type="primary" @click="onSubmit">确认</el-button>
</div>
</div>
@ -138,8 +126,7 @@ import { ref, reactive, watch } from 'vue'
import { useRoute } from "vue-router"
import { ElMessage } from 'element-plus'
import lodash_ from 'lodash'
const route = useRoute()
import keyboard from '@/views/home/components/keyboard.vue'
const stored = ref(false)//储值余额
@ -188,7 +175,6 @@ const moneys = reactive({
const _handleKeyPress = (e) => {
console.log('点击传e', e.target.dataset.num);
let num = e.target.dataset.num;
console.log(num)
//不同按键处理逻辑
// -1 代表无效按键，直接返回
if (num == -1) return false;
@ -211,6 +197,9 @@ watch(() => moneys.money, (newVal, oldVal) => {
})
//处理数字
const _handleNumberKey = (num) => {
if (num == undefined) {
return
}
if (moneys.money.length == 10) {
return
}

4
src/views/home/index.vue
View File

@ -80,7 +80,7 @@
<!-- 修改取餐号 -->
<takeFoodCode />
<el-drawer v-model="membershow" :with-header="true" size="90%" title="选择会员" >
<member></member>
<member :membershow="1"></member>
</el-drawer>
<takeFoodCode ref="takeFoodCodeRef" title="修改取餐号" placeholder="请输入取餐号" @success="takeFoodCodeSuccess" />
<!-- 结算订单 -->
@ -99,7 +99,7 @@ import { createCart, queryCart, createCode } from '@/api/product'
// 商品列表
import goods from '@/views/home/components/goods.vue'
import member from '@/views/home/components/member.vue'
import member from '@/views/member/index.vue'
const membershow = ref(false)
const store = useUser()
const remarkRef = ref(null)

73
src/views/member/components/add.vue Normal file
View File

@ -0,0 +1,73 @@
<template>
<div class="dialog_footer" v-for="(item, index) in props.flowingwater.list" :key="index">
<div class="dialog_footer_left">
<span>{{ item.biz_name }}</span>
<span>{{ dayjs(item.create_time).format("YYYY-MM-DD") }}</span>
</div>
<div class="dialog_footer_right">
<span>{{ item.balance }}</span>
<span>{{ item.amount }}</span>
</div>
</div>
</template>
<script setup>
import { ref } from 'vue'
import { dayjs } from 'element-plus'
const props = defineProps({
flowingwater: {
type: Object,
default: {}
}
})
</script>
<style scoped lang="scss">
.dialog_footer:nth-child(1) {
margin-top: 0;
}
.dialog_footer {
margin-top: 10px;
display: flex;
justify-content: space-between;
align-items: center;
border-bottom: 1px solid #ccc;
padding-bottom: 6px;
.dialog_footer_left {
display: flex;
flex-direction: column;
align-items: flex-start;
span:nth-child(1) {
font-size: 18px;
font-weight: 500;
}
span:nth-child(2) {
margin-top: 10px;
color: #333;
}
}
.dialog_footer_right {
display: flex;
flex-direction: column;
align-items: flex-end;
span:nth-child(1) {
color: #fc3d3d;
font-size: 16px;
}
span:nth-child(2) {
margin-top: 10px;
font-size: 14px;
}
}
}
</style>

475
src/views/member/index.vue
View File

@ -1,40 +1,41 @@
<template>
<div class="orderbox">
<div class="orderbox_left">
<div class="demo_tabs">
<div class="demo_tabs" v-if="props.membershow == 0">
<div class="demo_tabs_div">
<el-input v-model="firstinput" placeholder="请输入手机号或编号" clearable />
<el-input v-model="tableData.phone" placeholder="请输入手机号或编号" @input="inputChange" clearable />
<el-button style="margin-left: 10px;" type="primary" @click="memberaddshow = true">添加</el-button>
</div>
</div>
<el-table :data="tableData" height="90%" style="width: 100%;margin-top: 10px;">
<el-table-column prop="date" label="昵称" width="" />
<el-table-column prop="name" label="手机" width="" />
<el-table-column prop="address" label="编号" />
<el-table-column prop="address" label="等级" />
<el-table-column prop="address" label="积分" />
<el-table-column prop="address" label="余额" />
<el-table :data="tableData.list" style="width: 100%;margin-top: 10px;height:80%;"
:row-class-name="tableRowClassName" @cell-click="cellclicktableData">
<el-table-column prop="name" label="昵称" />
<el-table-column prop="telephone" label="手机" width="200px" />
<el-table-column prop="code" label="编号" width="150px" />
<el-table-column prop="level" label="等级" />
<el-table-column prop="levelConsume" label="积分" />
<el-table-column prop="amount" label="余额" />
</el-table>
<el-pagination layout="prev, pager, next, jumper" style="margin-top: 20px;" :total="Number(tableData.total)"
@current-change="handleCurrentChange" />
</div>
<div class="orderbox_right">
<div class="orderbox_right_top">
<div class="orderbox_right_topdiv">
<span>会员昵称：</span>
<span>admin</span>
<span>{{ tableData.list[datarow].name }}</span>
</div>
<div class="orderbox_right_topdiv">
<span>手机号码：</span>
<span>1999999999999</span>
<span>{{ tableData.list[datarow].telephone }}</span>
</div>
<div class="orderbox_right_topdiv">
<span>会员编号：</span>
<span>1245</span>
<span>{{ tableData.list[datarow].code }}</span>
</div>
<div class="orderbox_right_topdiv">
<span>会员等级：</span>
<span>未设置</span>
<span>{{ tableData.list[datarow].level }}</span>
</div>
<div class="orderbox_right_top_item">
<div class="orderbox_right_top_item_one">
@ -43,7 +44,7 @@
</el-icon>
<span class="orderbox_right_top_item_onespan">会员积分</span>
</div>
<div class="orderbox_right_top_item_tow">0</div>
<div class="orderbox_right_top_item_tow">{{ tableData.list[datarow].levelConsume }}</div>
</div>
<div class="orderbox_right_top_item" @click="stored = true">
<div class="orderbox_right_top_item_one">
@ -53,13 +54,13 @@
<span class="orderbox_right_top_item_onespan">储值余额</span>
</div>
<div class="orderbox_right_top_item_tow">
<span>0</span>
<span>{{ tableData.list[datarow].amount }}</span>
<el-icon size="10">
<ArrowRight />
</el-icon>
</div>
</div>
<div class="orderbox_right_top_item">
<!-- <div class="orderbox_right_top_item">
<div class="orderbox_right_top_item_one">
<el-icon :size="24" style="color:#00b58d ;">
<CopyDocument />
@ -72,108 +73,81 @@
<ArrowRight />
</el-icon>
</div>
</div>
</div> -->
</div>
<div class="orderbox_right_button">
<el-button style="width: 100%;" type="primary" @click="recharge = true">会员充值</el-button>
<el-button style="width: 100%; margin-top: 10px; margin-left:0px;" type="danger">取消</el-button>
<div class="orderbox_right_input" style="margin-top:20px ;" v-if="props.membershow == 1">
<el-input placeholder="请输入会员手机号或者编号" v-model="tableData.phone" clearable @input="inputChange"></el-input>
</div>
<keyboard v-if="props.membershow == 1" @consumeFees="consumeFees"></keyboard>
<div class="orderbox_right_button" v-if="props.membershow == 0">
<router-link to="/" style="width: 35%;">
<el-button style="width: 100%;" @click="recharge = true">创建订单</el-button>
</router-link>
<el-button style="width: 60%;" type="primary">账户充值</el-button>
</div>
<div class="orderbox_right_button" v-if="props.membershow == 1">
<router-link to="/" style="width: 35%;">
<el-button style="width: 100%;" @click="memberaddshowclose">添加会员</el-button>
</router-link>
<el-button style="width: 60%;" type="primary">确认</el-button>
</div>
</div>
<el-dialog v-model="stored" title="余额明细" width="500" :before-close="handleClose">
<div class="dialog_footer" v-for="(iten, index) in 6" :key="index">
<div class="dialog_footer_left">
<span>微信用户</span>
<span>2021-02-22 18:05:53</span>
</div>
<div class="dialog_footer_right">
<span>19000</span>
<span>26300</span>
</div>
</div>
<add :flowingwater='flowingwater' />
</el-dialog>
<el-dialog v-model="memberaddshow" title="添加会员" width="600" :before-close="memberaddshowclose">
<el-dialog v-model="memberaddshow" title="添加会员" width="600" :before-close="memberaddshowclose"
@open="membrform = { ...resetMembrform }">
<el-form ref="formRef" :rules="rules" :model="membrform" label-width="70px" hide-required-asterisk>
<el-form-item label="手机号" prop="phone">
<el-input v-model="membrform.phone" />
</el-form-item>
<el-form-item label="生日" prop="date1">
<el-form-item label="昵称" prop="nickName">
<el-input v-model="membrform.nickName" />
</el-form-item>
<el-form-item label="生日" prop="birthDay">
<el-col :span="11">
<el-date-picker v-model="membrform.date1" type="date" placeholder="请选择生日" style="width: 100%" />
<el-date-picker v-model="membrform.birthDay" type="date" placeholder="请选择生日" style="width: 100%" />
</el-col>
</el-form-item>
<el-form-item label="性别">
<el-radio-group v-model="membrform.resource">
<el-radio label="男" />
<el-radio label="女" />
<el-form-item label="性别" prop="sex">
<el-radio-group v-model="membrform.sex">
<el-radio :label="1">男</el-radio>
<el-radio :label="2">女</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="等级">
<el-select v-model="membrform.region" placeholder="请选择等级">
<el-form-item label="等级" prop="level">
<el-select v-model="membrform.level" placeholder="请选择等级">
<el-option label="等级1" value="1" />
<el-option label="等级2" value="2" />
<el-option label="等级3" value="3" />
<el-option label="等级4" value="4" />
<el-option label="等级5" value="5" />
<el-option label="等级6" value="6" />
<el-option label="等级7" value="7" />
<el-option label="等级8" value="8" />
</el-select>
</el-form-item>
<el-form-item>
<el-button style="width: 100%;" type="primary" @click="onSubmit">确认</el-button>
<el-button style="width: 100%;" type="primary" @click="createMembermemberSubmit">确认</el-button>
</el-form-item>
</el-form>
</el-dialog>
<el-dialog v-model="recharge" title="会员充值" width="800" :before-close="handlerecharge">
<el-dialog v-model="recharge" title="会员充值" width="400" :before-close="handlerecharge">
<div class="recharge_footer">
<div class="recharge_footer_item">
<!-- <div class="recharge_footer_item">
<div class="recharge_footer_items" v-for="(item, index) in 6" :key="index">
<div>充1000送300</div>
<div>充1000.00到13000.00</div>
</div>
</div>
</div> -->
<div class="recharge_footer_itemright">
<div class="recharge_footer_itemright_input">
<div>充值金额：</div>
<div v-if="moneys.money">{{ moneys.money ? moneys.money : '请输入充值金额' }}</div>
<div v-if="moneys">{{ moneys ? moneys : '请输入充值金额' }}</div>
</div>
<div class='keyboard' @click.stop='_handleKeyPress'>
<div class='key-row'>
<div class='key-cell cell_b' data-num='7'>7</div>
<div class='key-cell cell_b' data-num='8'>8</div>
<div class='key-cell cell_b' data-num='9'>9</div>
<div class='key-cell cell_b' data-num='-1'></div>
</div>
<div class='key-row'>
<div class='key-cell cell_b' data-num='4'>4</div>
<div class='key-cell cell_b' data-num='5'>5</div>
<div class='key-cell cell_b' data-num='6'>6</div>
<div class='key-cell cell_b' data-num='-1'></div>
</div>
<div class='key-row'>
<div class='key-cell cell_b' data-num='1'>1</div>
<div class='key-cell cell_b' data-num='2'>2</div>
<div class='key-cell cell_b' data-num='3'>3</div>
<div class='key-cell cell_b' data-num='-1'></div>
</div>
<div class="key-zero-and-point">
<div class="a cell_b zero" data-num='0'>0</div>
<div class="a cell_b point" data-num='.'>.</div>
</div>
<div @touchstart="touchstart" @touchend="touchend" data-num='D' class="key-confirm2">
<text data-num='D'>C</text>
</div>
<div class='key-confirm' style="background:green">
<div data-num='S'>
<div data-num='S' class="title">确认</div>
</div>
</div>
<div class='keyboard'>
<cwxeyboard @confirmEvent="confirmEvent" @consumeFee="consumeFee" btn-color="orange" title="支付">
</cwxeyboard>
</div>
</div>
@ -185,62 +159,137 @@
<script setup>
import { ref, reactive, watch, onMounted } from 'vue'
import { useRoute } from "vue-router"
import { ElMessage } from 'element-plus'
import { queryMembermember } from '@/api/member/index.js'
import { ElMessage, dayjs } from 'element-plus'
import { queryMembermember, createMembermember, memberqueryMemberAccount, accountPaymember } from '@/api/member/index.js'
import { useUser } from "@/store/user.js"
const route = useRoute()//vue-router
import lodash from 'lodash'
import add from '@/views/member/components/add.vue'
import cwxeyboard from '@/components/cwx-keyboard/cwx-keyboard.vue'
import keyboard from '@/views/home/components/keyboard.vue'
const store = useUser()
const firstinput = ref('')//搜索输入框
const stored = ref(false)//储值余额
const handleClose = () => {
const handleClose = async () => {
stored.value = !stored.value
}
const props = defineProps({//首页传值
membershow: {
type: String,
default: '0'
},
placeholder: {
type: String,
default: '提示'
}
})
const flowingwater = reactive({//获取流水初始化
total: '',
list: []
})
const consumeFee = (e) => { //接收子组件值 并赋值给父组件
moneys.value = e
}
const consumeFees = (e) => {
console.log(22222,44)
tableData.phone = e
}
const confirmEvent = async () => {//子组件 确认按钮
try {
let res = await accountPaymember({
shopId: store.userInfo.shopId,
memberId: tableData.list[datarow.value].id,
amount: moneys.value
})
if (res == null) {
recharge.value = false
ElMessage({
message: '充值成功',
type: 'success',
})
resetMembrform.value = { ...membrform.value }
asyncqueryMembermember()
}
} catch (error) {
}
}
const MemberAccount = async () => {//获取流水
try {
let res = await memberqueryMemberAccount({
memberId: tableData.list[datarow.value].id,
page: 1,
pageSize: 10
})
flowingwater.total = res.total
flowingwater.list = res.list
} catch (error) {
ElMessage({
message: '获取失败',
type: 'error',
})
}
}
const recharge = ref(false)//充值
const memberaddshow = ref(true) //添加会员
const memberaddshow = ref(false) //添加会员
const memberaddshowclose = () => {
memberaddshow.value = !memberaddshow.value
}
const asyncqueryMembermember = async () => {
const tableData = reactive({//表格数据
list: [{
name: "",
amount: "",
levelConsume: "",
level: "",
code: "",
telephone: ""
}],
page: 1,
pageSize: 10,
phone: '',
total: ''
})
const inputChange = lodash.debounce(function () { //搜索手机号
asyncqueryMembermember()
}, 500)
const asyncqueryMembermember = async () => {//会员列表数据
let res = await queryMembermember({
shopId: store.userInfo.shopId
shopId: store.userInfo.shopId,
page: tableData.page,
pageSize: 10,
phone: tableData.phone
})
console.log(res,'1111111')
if (res) {
tableData.list = res.list
tableData.total = res.total
MemberAccount()
}
}
const tableRowClassName = ({ row, rowIndex }) => {//动态给tab加样式
if (rowIndex === datarow.value) {
return 'warning-row'
} return ''
}
const datarow = ref(0) //初始化右边
const cellclicktableData = (row, column, cell, event) => {
const index = tableData.list.findIndex(item => item.id == row.id)
datarow.value = index
}
const handleCurrentChange = (val) => { //页码
tableData.page = val
datarow.value = 0
asyncqueryMembermember()
}
const handlerecharge = () => {
recharge.value = !recharge.value
}
const tableData = [
{
date: '2016-05-03',
name: 'Tom',
address: '1s',
},
{
date: '2016-05-02',
name: 'Tom',
address: '1s',
},
{
date: '2016-05-04',
name: 'Tom',
address: '1s',
},
{
date: '2016-05-01',
name: 'Tom',
address: '1s',
},
]
const membrform = reactive({ //membrform 添加会员表单
const resetMembrform = ref({})
const membrform = ref({ //membrform 添加会员表单
phone: '',
region: '',
date1: '',
date2: '',
delivery: false,
type: [],
resource: '',
desc: '',
nickName: '',
level: '',
birthDay: '',
sex: '',
level: ''
})
const formRef = ref(null); //ref membrform
const rules = reactive({ // membrform验证
@ -251,7 +300,28 @@ const rules = reactive({ // membrform验证
trigger: "blur",
},
],
date1: [
nickName: [
{
required: true,
message: "请输入昵称",
trigger: "blur",
},
],
sex: [
{
required: true,
message: "请选择性别",
trigger: 'change',
},
],
level: [
{
required: true,
message: "请选择等级",
trigger: 'change',
},
],
birthDay: [
{
type: 'date',
required: true,
@ -259,140 +329,38 @@ const rules = reactive({ // membrform验证
trigger: 'change',
},
],
name: [
{
required: true,
message: "请输入登录密码",
trigger: "blur",
},
],
});
const onSubmit = () => {
const createMembermemberSubmit = async () => { ///添加会员
formRef.value.validate(async (valid) => {
console.log(valid)
if (valid) {
// const params = {
// serialNumber: RandomNumBoth(1000, 9999),
// clientType: 'pc',
// loginName: form.phone,
// password: form.password
// }
// store.userlogin(params).then((res) => {
// loading.value = true;
// ElMessage.success("登录成功");
// setTimeout(() => {
// router.replace({
// name: "home",
// });
// }, 1000);
// }).catch(err => {
// loading.value = false
// });
let res = await createMembermember({
shopId: store.userInfo.shopId,
phone: membrform.value.phone,
nickName: membrform.value.nickName,
sex: membrform.value.sex,
level: membrform.value.level,
birthDay: dayjs(membrform.value.birthDay).format("YYYY-MM-DD")
})
if (res == null) {
memberaddshowclose()
ElMessage({
message: '添加成功',
type: 'success',
})
asyncqueryMembermember()
}
}
});
console.log(membrform.name)
console.log('submit!')
}
const moneys = reactive({
money: ''
})
const _handleKeyPress = (e) => {
console.log('点击传e', e.target.dataset.num);
let num = e.target.dataset.num;
console.log(num)
//不同按键处理逻辑
// -1 代表无效按键，直接返回
if (num == -1) return false;
switch (String(num)) {
//小数点
case '.':
_handleDecimalPoint();
break;
//删除键
case 'D':
_handleDeleteKey();
break;
//清空键
case 'C':
_handleClearKey();
break;
//确认键
case 'S':
_handleConfirmKey();
break;
default:
_handleNumberKey(num);
break;
}
}
watch(() => moneys.money, (newVal, oldVal) => {
console.log(`New: ${newVal}, Old: ${oldVal}`)
})
//处理数字
const _handleNumberKey = (num) => {
if (moneys.money.length == 10) {
return
}
let S = moneys.money;
//如果有小数点且小数点位数不小于2
if (S.indexOf('.') > -1 && S.substring(S.indexOf('.') + 1).length < 2)
moneys.money = S + num;
//没有小数点
if (!(S.indexOf('.') > -1)) {
//如果第一位是0，只能输入小数点
if (num == 0 && S.length == 0)
moneys.money = '0.';
else {
if (S.length && Number(S.charAt(0)) === 0) return;
moneys.money = S + num;
}
}
}
//处理小数点函数
const _handleDecimalPoint = () => {
//如果包含小数点，直接返回
if (moneys.money.indexOf('.') > -1) return false;
//如果小数点是第一位，补0
if (!moneys.money.length) {
moneys.money = '0.';
} else {
//如果不是，添加一个小数点
moneys.money = moneys.money + '.';
}
}
//处理删除键
const _handleDeleteKey = () => {
let S = moneys.money;
//如果没有输入，直接返回
if (!S.length) return false;
//否则删除最后一个
moneys.money = S.substring(0, S.length - 1);
}
//处理清空键
const _handleClearKey = () => {
moneys.money = '';
}
const _handleConfirmKey = () => {
let S = moneys.money;
//未输入
if (!S.length || S == 0) {
ElMessage({
message: '请输入正确的数值',
type: 'warning',
})
return false;
}
//将 8. 这种转换成 8.00
if (S.indexOf('.') > -1 && S.indexOf('.') == (S.length - 1))
S = Number(S.substring(0, S.length - 1)).toFixed(2);
//保留两位
S = Number(S).toFixed(2);
this.$emit('confirmEvent', S); //提交参数
}
const moneys = ref('')// 钱数
onMounted(() => {
asyncqueryMembermember()
// resetMembrform.value = { ...membrform.value }
asyncqueryMembermember()
})
</script>
@ -460,7 +428,6 @@ onMounted(() => {
}
}
}
.orderbox_right {
@ -518,11 +485,15 @@ onMounted(() => {
}
}
.orderbox_right_button {
position: absolute;
width: 90%;
left: 50%;
bottom: 16px;
display: flex;
justify-content: space-between;
align-items: center;
transform: translateX(-50%) !important;
}
}
@ -610,7 +581,7 @@ onMounted(() => {
.recharge_footer_itemright {
padding-left: 20px;
width: 40%;
width: 100%;
position: relative;
bottom: 0;
left: 0;

4
vite.config.js
View File

@ -9,8 +9,8 @@ export default defineConfig({
server: {
proxy: {
'/api': {
// target: 'https://cashierclient.sxczgkj.cn/cashier-client', // 测试
target: 'http://192.168.2.87:10587/cashier-client', // 国成
target: 'https://cashierclient.sxczgkj.cn/cashier-client', // 测试
// target: 'http://192.168.2.87:10587/cashier-client', // 国成
changeOrigin: true,
rewrite: (path) => path.replace(/^\/api/, '')
}