This commit is contained in:
weipengfei 2024-06-15 19:03:07 +08:00
parent 0613c96862
commit 0788b36218
15 changed files with 2088 additions and 632 deletions

View File

@ -1,10 +1,14 @@
VITE_NOW_TYPE = 'dist' VITE_NOW_TYPE = 'dist'
VITE_PUSH_URL = 'ws://192.168.1.22:8787'
VITE_BASE_URL = 'http://192.168.1.22:8545'
# VITE_PUSH_URL ='wss://test-multi-store.lihaink.cn/pull' # VITE_PUSH_URL = 'ws://192.168.1.201:8787'
# VITE_BASE_URL = 'https://test-multi-store.lihaink.cn' # VITE_BASE_URL = 'http://192.168.1.201:8545'
# VITE_PUSH_URL = 'ws://192.168.1.22:8787'
# VITE_BASE_URL = 'http://192.168.1.22:8545'
VITE_PUSH_URL ='wss://test-multi-store.lihaink.cn/pull'
VITE_BASE_URL = 'https://test-multi-store.lihaink.cn'
# VITE_PUSH_URL ='wss://multi-store.lihaink.cn/pull' # VITE_PUSH_URL ='wss://multi-store.lihaink.cn/pull'
# VITE_BASE_URL = 'https://multi-store.lihaink.cn' # VITE_BASE_URL = 'https://multi-store.lihaink.cn'

View File

@ -177,3 +177,10 @@ export function subOrdersListApi(data) {
export function merchantOrderCountApi(data) { export function merchantOrderCountApi(data) {
return request.get(`/order/retailOrder/merchant_order_count`, { params: data }) return request.get(`/order/retailOrder/merchant_order_count`, { params: data })
} }
/**
* @description 发送短信验证(采购款)
*/
export function storeOrderCheckSmsApi(data) {
return request.post(`/store_order/StoreOrder/checkSms`, data)
}

View File

@ -30,20 +30,48 @@ export function logout() {
/** /**
* @description 会员类型 * @description 会员类型
*/ */
export function userShipApi() { export function userShipApi(data) {
return request.get(`/user/UserShip/lists`) return request.get(`/user/UserShip/lists`, { params: data })
} }
/** /**
* @description 添加会员 * @description 添加会员
*/ */
export function userAddApi(data) { export function userAddApi(data) {
return request.post(`/user/user/add`, data) return request.post(`/user/user/add`, data)
} }
/** /**
* @description 会员列表 * @description 会员列表
*/ */
export function userListsApi() { export function userListsApi(data) {
return request.get(`/user/user/lists`) return request.get(`/user/user/lists`, { params: data })
} }
/**
* @description 用户详情
*/
export function userDetailApi(data) {
return request.get(`/user/user/detail`, { params: data })
}
/**
* @description 地址详情
*/
export function userAddressDetailApi(data) {
return request.get(`/user/Address/detail`, { params: data })
}
/**
* @description 修改地址
*/
export function userAddressEditApi(data) {
return request.post(`/user/Address/edit`, data)
}
/**
* @description 充值
*/
export function userRechangeAmountApi(data) {
return request.post(`/store_order/StoreOrder/rechange_amount`, data)
}

View File

@ -1,10 +1,10 @@
<script setup> <script setup>
import {ref, watch, nextTick, computed, onMounted, onUnmounted} from "vue"; import { ref, watch, nextTick, computed, onMounted, onUnmounted } from "vue";
import {orderCreateApi, orderStatusApi, orderPayApi} from "@/api/store.js"; import { orderCreateApi, orderStatusApi, orderPayApi, storeOrderCheckSmsApi } from "@/api/store.js";
import {ElMessage} from "element-plus"; import { ElMessage } from "element-plus";
import {audioplay} from "@/utils/audio.js"; import { audioplay } from "@/utils/audio.js";
import mitt from "@/utils/mitt.js"; import mitt from "@/utils/mitt.js";
import {useUserStore} from "@/store/user.js"; import { useUserStore } from "@/store/user.js";
const drawer = ref(false); const drawer = ref(false);
const active = ref(1); const active = ref(1);
@ -45,10 +45,13 @@ const changeActive = (e) => {
const form = ref({}); const form = ref({});
const cart_id = ref([]); const cart_id = ref([]);
const uid = ref('');
const isRePay = ref(false); const isRePay = ref(false);
const setForm = (e) => { const setForm = (e) => {
form.value = e.data; form.value = e.data;
cart_id.value = e.cart_id; cart_id.value = e.cart_id;
uid.value = e.uid;
console.log('选择了用户==', uid.value||'游客');
isRePay.value = e.isRePay || false; isRePay.value = e.isRePay || false;
}; };
@ -397,17 +400,48 @@ const keyboard = (event) => {
} }
}; };
const getSms = () => {
storeOrderCheckSmsApi({
cart_id: cart_id.value,
uid: uid.value
}).then(res => {
ElMessage({
message: '发送成功',
type: "success",
});
})
}
const smsCode = ref('');
// /
const handlecodeEnter = () => {
orderCreateApi({
pay_type: 18, ///
sms_code: smsCode.value,
cart_id: cart_id.value,
uid: uid.value
}).then(res => {
drawer.value = false;
ElMessage({
message: res.msg,
type: "success",
});
changeActive(1);
beforeClose();
})
}
// //
const isFocus = ref(false); const isFocus = ref(false);
// //
const aleft = () => { const aleft = () => {
if (!drawer.value || (isFocus.value && input.value.length > 0)) return; if (!drawer.value || (isFocus.value && input.value.length > 0)) return;
if (active.value == 2) return changeActive(1); if (active.value == 2) return changeActive(1);
if (active.value == 3) return changeActive(2);
}; };
const aright = () => { const aright = () => {
if (!drawer.value || (isFocus.value && input.value.length > 0)) return; if (!drawer.value || (isFocus.value && input.value.length > 0)) return;
if (active.value == 1) return changeActive(2); if (active.value == 1) return changeActive(2);
if (active.value == 2) return changeActive(3);
}; };
onMounted(() => { onMounted(() => {
mitt.on("left", aleft); mitt.on("left", aleft);
@ -431,12 +465,15 @@ onUnmounted(() => {
<div class="left" :class="{ active: active == 1 }" @click="changeActive(1)"> <div class="left" :class="{ active: active == 1 }" @click="changeActive(1)">
微信/支付宝 微信/支付宝
</div> </div>
<div class="right" :class="{ active: active == 2 }" @click="changeActive(2)"> <div class="center" :class="{ active: active == 2 }" @click="changeActive(2)">
现金收款 现金收款
</div> </div>
<div class="right" :class="{ active: active == 3 }" @click="changeActive(3)">
采购款
</div>
</div> </div>
<div> <div>
<div v-if="form.activities==1" style="display: inline-block;margin-right: 20px"> <div v-if="form.activities == 1" style="display: inline-block;margin-right: 20px">
<div style="display: inline-block;margin-right: 20px"> <div style="display: inline-block;margin-right: 20px">
<div style="color: #999;padding: 2rem 0 0.3rem 0">原价:</div> <div style="color: #999;padding: 2rem 0 0.3rem 0">原价:</div>
<div style="color: #f5222d; padding-bottom: 2rem"> <div style="color: #f5222d; padding-bottom: 2rem">
@ -460,12 +497,11 @@ onUnmounted(() => {
</div> </div>
<div v-loading="loading" element-loading-text="支付中" class="card1" v-if="active == 1"> <div v-loading="loading" element-loading-text="支付中" class="card1" v-if="active == 1">
<el-input ref="codeRef" v-model="input" autofocus class="code-input" <el-input ref="codeRef" v-model="input" autofocus class="code-input" placeholder="请点击输入框聚焦扫码或输入编码号"
placeholder="请点击输入框聚焦扫码或输入编码号" @keyup.enter="handleEnter" @focus="isFocus = true" @blur="isFocus = false" />
@keyup.enter="handleEnter" @focus="isFocus = true" @blur="isFocus = false"/>
<div class="tips"></div> <div class="tips"></div>
</div> </div>
<div class="card2" v-else> <div class="card2" v-else-if="active == 2">
<div class="drawer-body"> <div class="drawer-body">
<div class="counter"> <div class="counter">
<div class="received"> <div class="received">
@ -492,7 +528,7 @@ onUnmounted(() => {
<div class="right"> <div class="right">
<el-button @click="delNum"> <el-button @click="delNum">
<el-icon> <el-icon>
<Delete/> <Delete />
</el-icon> </el-icon>
</el-button> </el-button>
<el-button @click="delNum(-1)">C</el-button> <el-button @click="delNum(-1)">C</el-button>
@ -505,6 +541,15 @@ onUnmounted(() => {
</div> </div>
</div> </div>
</div> </div>
<div class="card3" v-else>
<div class="codes">
<el-input v-model="smsCode" autofocus class="code-input" placeholder="请输入验证码"
@keyup.enter="handlecodeEnter" @focus="isFocus = true" @blur="isFocus = false" />
<el-button type="primary" @click="getSms" class="get-code-btn">获取验证码</el-button>
</div>
<el-button type="primary" @click="handlecodeEnter" class="code-pay">确认支付</el-button>
<!-- <div class="tips"></div> -->
</div>
</div> </div>
</template> </template>
<template #footer> <template #footer>
@ -527,7 +572,7 @@ onUnmounted(() => {
width: 25rem; width: 25rem;
display: flex; display: flex;
& > div { &>div {
flex: 1; flex: 1;
border: 1px solid #ccc; border: 1px solid #ccc;
text-align: center; text-align: center;
@ -557,6 +602,7 @@ onUnmounted(() => {
.code-input { .code-input {
width: 100%; width: 100%;
height: 3rem; height: 3rem;
font-size: 1.2rem;
} }
.tips { .tips {
@ -567,6 +613,32 @@ onUnmounted(() => {
background-repeat: no-repeat; background-repeat: no-repeat;
} }
} }
.card3 {
.codes {
width: 38rem;
display: flex;
align-items: center;
.code-input {
flex: 1;
height: 3rem;
font-size: 1.2rem;
}
.get-code-btn {
height: 3rem;
margin-left: 1rem;
}
}
.code-pay {
margin-top: 4rem;
width: 100%;
height: 3rem;
border-radius: 3rem;
}
}
} }
.cancel-btn { .cancel-btn {

665
src/components/payUser.vue Normal file
View File

@ -0,0 +1,665 @@
<script setup>
import { ref, watch, nextTick, computed, onMounted, onUnmounted } from "vue";
import { orderCreateApi, orderStatusApi, orderPayApi } from "@/api/store.js";
import { ElMessage } from "element-plus";
import { audioplay } from "@/utils/audio.js";
import mitt from "@/utils/mitt.js";
import { useUserStore } from "@/store/user.js";
import { userAddressDetailApi, userAddressEditApi, userRechangeAmountApi } from "@/api/user"
const drawer = ref(false);
const active = ref(1);
const input = ref("");
const codeRef = ref("");
const userStore = useUserStore();
const cancelClick = () => {
beforeClose();
};
const open = () => {
nextTick(() => {
setTimeout(() => {
loading.value = false;
input.value = "";
reLoad.value = true;
codeRef.value?.focus();
changeActive(active.value);
}, 300);
});
};
const changeActive = (e) => {
active.value = e;
if (active.value == 2) {
active.value = 1;
return ElMessage.error('暂不支持现金收款');
//
window.addEventListener("keydown", keyboard);
} else {
window.removeEventListener("keydown", keyboard);
nextTick(() => {
input.value = "";
codeRef.value?.focus();
});
}
};
const form = ref({
price: 0,
uid: ''
});
const cart_id = ref([]);
const isRePay = ref(false);
const setForm = (e) => {
form.value = e.data;
cart_id.value = e.cart_id;
isRePay.value = e.isRePay || false;
};
const setRePay = (e) => {
form.value.total = e.price;
order_id.value = e.order_id;
};
const emit = defineEmits(["paySuccess"]);
const reLoad = ref(false);
const numList = ref([
"1",
"2",
"3",
"4",
"5",
"6",
"7",
"8",
"9",
"0",
"00",
".",
]);
let timecount = 0; //
const regexWechat = /^(10|11|12|13|14|15)\d{16}$/; // 10-1518
const regexPay = /^(25|26|27|28|29|30)\d{14,22}$/; // 25-3016-24
const order_id = ref("");
//
const handleEnter = () => {
loading.value = true;
codeRef.value.blur();
if (isRePay.value) orderPay();
else {
let pay_type;
if (regexWechat.test(input.value)) pay_type = "9"; //
else if (regexPay.test(input.value)) pay_type = "13"; //
else {
loading.value = false;
input.value = "";
codeRef.value.focus();
return ElMessage.error("请输入正确的支付码");
}
userRechangeAmountApi({
uid: form.value.uid,
price: form.value.price,
pay_type: pay_type,
auth_code: input.value,
})
.then((res) => {
if (res.data.out_trade_no && res.msg == "支付成功") {
drawer.value = false;
ElMessage({
message: "支付成功",
type: "success",
});
// if(res.data.message) audioplay(res.data.message);
beforeClose(res.data);
} else {
if (res.msg == "用户支付中" && res.code == 1) {
ElMessage.warning(res.msg);
mitt.on("pay_success", (e) => {
ElMessage({
message: "支付成功",
type: "success",
});
setTimeout(() => {
mitt.off("pay_success");
}, 200);
drawer.value = false;
beforeClose(e);
});
}
}
})
.catch((err) => {
loading.value = false;
nextTick(() => {
codeRef.value?.focus();
});
});
}
};
const orderPay = () => {
let query;
let pay_type = 17;
if (active.value == 1) {
if (regexWechat.test(input.value)) pay_type = "9"; //
else if (regexPay.test(input.value)) pay_type = "13"; //
else {
loading.value = false;
input.value = "";
codeRef.value.focus();
return ElMessage.error("请输入正确的支付码");
}
}
orderPayApi({
order_id: form.value.order_id,
pay_type: pay_type,
auth_code: input.value
}).then((res) => {
if (res.msg?.includes('成功')) {
drawer.value = false;
ElMessage({
message: "支付成功",
type: "success",
});
// if(res.data.message) audioplay(res.data.message);
beforeClose();
} else {
if (res.msg == "用户支付中" && res.code == 1) {
ElMessage.warning(res.msg);
mitt.on("pay_success", (e) => {
ElMessage({
message: "支付成功",
type: "success",
});
setTimeout(() => {
mitt.off("pay_success");
}, 200);
drawer.value = false;
beforeClose(e);
});
}
}
})
.catch((err) => {
input.value = "";
loading.value = false;
nextTick(() => {
codeRef.value?.focus();
});
});
};
const count = ref(0); // 3, 3,
const getOrderStatus = (id) => {
if (!id) return;
count.value++;
timecount += 5000;
orderStatusApi({
order_sn: id,
})
.then((res) => {
if (res.data.trade_state == "SUCCESS") {
ElMessage({
message: res.message,
type: "success",
});
// if(res.data.message) audioplay(res.data.message);
beforeClose();
} else {
ElMessage({
message:
res.data.trade_state == "USERPAYING"
? "用户正在支付中"
: res.message,
type: "error",
});
input.value = "";
loading.value = false;
nextTick(() => {
codeRef.value?.focus();
});
}
})
.catch((err) => {
if (reLoad.value && count.value < 3)
setTimeout(
() => {
getOrderStatus(id);
},
15000 - timecount > 0 ? 15000 - timecount : 0
);
else {
input.value = "";
loading.value = false;
nextTick(() => {
codeRef.value?.focus();
});
}
});
};
const beforeClose = (data) => {
window.removeEventListener("keydown", keyboard);
reLoad.value = false;
loading.value = false;
input.value = "";
collection.value = "";
collectionArray.value = [];
codeRef.value?.blur();
emit("paySuccess", data);
drawer.value = false;
};
const loading = ref(false);
defineExpose({
drawer,
setForm,
setRePay,
beforeClose,
});
const collectionArray = ref([]);
const collection = ref(""); //
const changePrice = computed(() => {
//
if (+collection.value > 0) {
return (collection.value - form.value.total).toFixed(2);
}
return -1;
});
const defaultcalc = ref(false);
//
const delNum = (type) => {
if (type === -1) {
collectionArray.value = [];
} else {
collectionArray.value.pop();
}
collection.value = collectionArray.value.length
? collectionArray.value.join("")
: 0;
};
//
const numTap = (item) => {
if (defaultcalc.value === false) {
collection.value = "";
defaultcalc.value = true;
}
let x = String(collection.value).indexOf(".") + 1;
let y = String(collection.value).length - x;
console.log(x, y);
if (x === 0 || y < 2) {
if (collectionArray.value.join("") <= 9999999) {
collectionArray.value.push(item);
}
collection.value =
collectionArray.value.join("") > 99999999
? 99999999
: collectionArray.value.join("");
}
};
//
const cashBnt = () => {
if (
changePrice.value === "" ||
changePrice.value === null ||
changePrice.value === undefined ||
+collection.value < +form.value.total
)
return ElMessage.error("收款金额应该大于等于应收金额");
if (isRePay.value) orderPay();
else
userRechangeAmountApi({
uid: form.value.uid,
price: form.value.price,
pay_type: pay_type,
pay_type: "17", // 17
})
.then((res) => {
drawer.value = false;
ElMessage({
message: res.msg,
type: "success",
});
changeActive(1);
beforeClose();
})
.catch((err) => {
loading.value = false;
});
};
//
const keyboard = (event) => {
let e = event || window.event;
let key = e.keyCode;
if (key == 37) return changeActive(2);
if (key == 120) return mitt.emit("F9");
if (key == 27) return beforeClose();
event.stopPropagation(); //
event.preventDefault(); //
switch (key) {
case 96:
case 48:
numTap(0);
break;
case 97:
case 49:
numTap(1);
break;
case 98:
case 50:
numTap(2);
break;
case 99:
case 51:
numTap(3);
break;
case 100:
case 52:
numTap(4);
break;
case 101:
case 53:
numTap(5);
break;
case 102:
case 54:
numTap(6);
break;
case 103:
case 55:
numTap(7);
break;
case 104:
case 56:
numTap(8);
break;
case 105:
case 57:
numTap(9);
break;
case 110:
numTap(".");
break;
case 190:
numTap(".");
break;
case 8:
delNum();
break;
case 13:
cashBnt();
break;
}
};
//
const isFocus = ref(false);
//
const aleft = () => {
if (!drawer.value || (isFocus.value && input.value.length > 0)) return;
if (active.value == 2) return changeActive(1);
};
const aright = () => {
if (!drawer.value || (isFocus.value && input.value.length > 0)) return;
if (active.value == 1) return changeActive(2);
};
onMounted(() => {
mitt.on("left", aleft);
mitt.on("right", aright);
});
onUnmounted(() => {
mitt.off("left", aleft);
mitt.off("right", aright);
});
</script>
<template>
<el-drawer size="60rem" v-model="drawer" direction="rtl" @open="open" :before-close="beforeClose">
<template #header>
<h4>选择支付方式</h4>
</template>
<template #default>
<div class="dra-body">
<div class="header">
<div class="left" :class="{ active: active == 1 }" @click="changeActive(1)">
微信/支付宝
</div>
<div class="right" :class="{ active: active == 2 }" @click="changeActive(2)">
现金收款
</div>
</div>
<div>
<div style="display: inline-block ">
<div style="color: #999; padding: 2rem 0 0.3rem 0">应收金额():</div>
<div style="color: #f5222d; padding-bottom: 2rem">
¥<span style="font-size: 1.6rem">{{ form?.price }}</span>
</div>
</div>
</div>
<div v-loading="loading" element-loading-text="支付中" class="card1" v-if="active == 1">
<el-input ref="codeRef" v-model="input" autofocus class="code-input" placeholder="请点击输入框聚焦扫码或输入编码号"
@keyup.enter="handleEnter" @focus="isFocus = true" @blur="isFocus = false" />
<div class="tips"></div>
</div>
<div class="card2" v-else>
<div class="drawer-body">
<div class="counter">
<div class="received">
<span v-if="collection">{{ collection }}</span>
<span v-else style="font-size: 1rem; color: #999">按下键盘输入客户支付金额</span>
</div>
<div class="balance" v-if="changePrice >= 0">
<div>
需找零()<span class="money">{{ changePrice }}</span>
</div>
<div class="tips">按回车(Enter)确认支付</div>
</div>
<div class="balance" v-else>
<div>不够找零, 请支付更多金额</div>
<div class="tips">按下小键盘输入金额</div>
</div>
<div class="keypad">
<div class="left">
<el-button v-for="item in numList" :key="item" @click="numTap(item)">{{
item
}}
</el-button>
</div>
<div class="right">
<el-button @click="delNum">
<el-icon>
<Delete />
</el-icon>
</el-button>
<el-button @click="delNum(-1)">C</el-button>
<el-button class="enter" :class="{ 'enter-disable': +collection < +form.total }"
:disabled="+collection < +form.total" @click="cashBnt">
确认
</el-button>
</div>
</div>
</div>
</div>
</div>
</div>
</template>
<template #footer>
<div style="width: 100%; display: flex; justify-content: center">
<el-button class="cancel-btn" @click="cancelClick">取消收款</el-button>
</div>
</template>
</el-drawer>
</template>
<style lang="scss" scoped>
.dra-body {
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
.header {
width: 25rem;
display: flex;
&>div {
flex: 1;
border: 1px solid #ccc;
text-align: center;
padding: 0.6rem 0;
cursor: pointer;
}
.left {
border-right: none;
border-radius: 5rem 0 0 5rem;
}
.right {
border-left: none;
border-radius: 0 5rem 5rem 0;
}
.active {
background-color: #1890ff;
color: #fff;
transition: 300ms;
border-color: #1890ff;
}
}
.card1 {
.code-input {
width: 100%;
height: 3rem;
}
.tips {
width: 38rem;
height: 16rem;
background: url("@/assets/pay.png");
background-size: 100% 100%;
background-repeat: no-repeat;
}
}
}
.cancel-btn {
width: 60%;
border-color: #1890ff;
color: #1890ff;
border-radius: 5rem;
height: 3rem;
font-size: 1.2rem;
}
.drawer-body {
width: 100%;
overflow-x: hidden;
}
.counter {
padding: 1.25rem;
border-radius: 1.25rem;
background-color: #f3f9ff;
.received {
height: 3rem;
padding: 0 1.25rem;
border: 1px solid #1890ff;
box-shadow: 0 0 0.18rem #1890ff;
border-radius: 0.5rem;
background-color: #ffffff;
font-size: 1.62rem;
line-height: 3rem;
color: #333;
}
.balance {
width: 100%;
box-sizing: border-box;
padding: 1.12rem 0 1.12rem 0.625rem;
text-align: start;
font-size: 0.95rem;
color: #303133;
display: flex;
justify-content: space-between;
.money {
color: #ff4a00;
}
.tips {
font-size: 0.8rem;
color: #999;
}
}
.keypad {
display: grid;
grid-template-columns: auto auto auto auto;
grid-gap: 0.625rem;
.left {
grid-column-end: span 3;
display: grid;
grid-template-columns: auto auto auto;
grid-gap: 0.625rem;
}
.right {
display: grid;
grid-template-columns: auto;
grid-gap: 0.625rem;
}
.el-button {
height: 3.875rem;
width: 8.125rem;
margin: 0 !important;
border: 0;
border-radius: 0.5rem;
font-weight: 500;
font-size: 1.75rem !important;
line-height: 3.87rem;
color: #1890ff;
&:focus {
box-shadow: none;
}
}
.enter {
grid-row-end: span 4;
height: 8.37rem;
line-height: 8.37rem;
background-color: #1890ff;
font-weight: 500;
font-size: 1.35rem !important;
color: #ffffff;
position: relative;
}
.enter-disable {
background-color: #ccc;
}
}
}
</style>

197
src/components/userList.vue Normal file
View File

@ -0,0 +1,197 @@
<script setup>
import { ref, onMounted, onUnmounted } from "vue";
import {
userListsApi
} from "@/api/user.js";
import { useUserStore } from "@/store/user.js";
import { ElMessage } from "element-plus";
import { useRouter } from "vue-router";
import mitt from "@/utils/mitt.js";
import moment from "moment";
const userStore = useUserStore();
const dialogVisible = ref(false);
const where = ref({
page_no: 1,
page_size: 20,
mobile: "",
});
const emit = defineEmits(['setUser'])
const loading = ref(false);
const total = ref(0);
const loadEnd = ref(false);
const orderList = ref([]);
const getOrderList = (reload = false) => {
if (reload) where.value.page_no = 1;
else if (loadEnd.value || loading.value) return;
loading.value = true;
userListsApi(where.value)
.then((res) => {
if (reload) orderList.value = res.data.lists;
else orderList.value = [...orderList.value, ...res.data.lists];
if (res.data.lists.length < where.value.page_size) loadEnd.value = true;
else where.value.page_no++;
total.value = res.data.count;
loading.value = false;
})
.catch((err) => {
loadEnd.value = true;
loading.value = false;
});
};
const setForm = (item, index) => {
emit("setUser", item);
dialogVisible.value = false;
};
const open = () => {
dialogVisible.value = true;
getOrderList(true);
};
defineExpose({
open
})
</script>
<template>
<el-dialog v-model="dialogVisible" title="选择用户" width="800">
<div class="check-user-list">
<div class="header-input">
<el-input v-model="where.mobile" placeholder="搜索手机号/ID" @keydown.enter="getOrderList(true)"
@clear="getOrderList(true)" clearable>
<template #append>
<el-button type="primary" style="
background-color: #1890ff;
color: #fff;
border-radius: 0 0.315rem 0.315rem 0;
" @click="getOrderList(true)">搜索</el-button>
</template>
</el-input>
</div>
<div class="order-lists" v-loading="loading" v-infinite-scroll="getOrderList"
:infinite-scroll-distance="300" :infinite-scroll-delay="500" style="overflow: auto">
<div class="item" v-for="(item, index) in orderList" :key="index" @click="setForm(item, index)">
<el-avatar class="avatar" :src="item.avatar" />
<div style="display: flex; flex-direction: column; justify-content: space-around;flex:1;">
<div class="top flex">
<div class="r-1"><span class="bold">{{ item.nickname }}</span><span>{{ ' (ID:' + item.id
+ ')' }}</span>
</div>
<div>手机号: {{ item.account }}</div>
</div>
<div class="bottom flex" style="justify-content: space-between;">
<!-- <div class="r-1">积分: <span class="red">55</span></div> -->
<div>采购款: <span class="red">{{ item.purchase_funds }}</span></div>
<div>
<el-tag type="primary" v-if="item.user_ship != 1">{{ item.user_ship_name }}</el-tag>
<el-tag type="success" v-else>{{ item.user_ship_name }}</el-tag>
</div>
</div>
</div>
</div>
<div v-if="loadEnd" class="load-end">没有更多了</div>
<div v-if="loading" class="load-end">加载中...</div>
</div>
</div>
</el-dialog>
</template>
<style scoped lang="scss">
.check-user-list {
border-radius: 1.2rem;
height: 70vh;
background-color: #fff;
width: 100%;
position: relative;
overflow: hidden;
display: flex;
flex-direction: column;
.header-nav {
display: flex;
justify-content: space-between;
padding: 1rem;
span {
color: #ff4a00;
}
.nav-item {
font-weight: bold;
}
}
.header-input {
padding: 1rem;
padding-top: 0;
border-bottom: 1px solid #eee;
}
.order-lists {
flex: 1;
overflow-y: auto;
display: flex;
flex-wrap: wrap;
.item {
width: 45%;
height: auto;
border-radius: 0.5rem;
cursor: pointer;
box-sizing: border-box;
padding: 1rem;
margin: 0.5rem;
background-color: #F5F5F5;
display: flex;
.avatar {
height: 4rem;
width: 4rem;
border-radius: 50%;
margin-right: 1rem;
flex-shrink: 0;
}
.flex {
display: flex;
flex-wrap: wrap;
}
.bold {
font-weight: bold;
}
.r-1 {
margin-right: 1rem;
}
.bottom {}
.red {
color: #ff4a00;
}
}
.item-active {
background-color: #efefef;
}
}
.load-end {
text-align: center;
padding: 1rem;
color: #333;
font-size: 0.8rem;
}
}
</style>

View File

@ -71,12 +71,12 @@ const list = ref([
ico: "FullScreen", ico: "FullScreen",
count: 0, count: 0,
}, },
{ // {
name: "statistics", // name: "statistics",
title: "盈收统计", // title: "",
ico: "TrendCharts", // ico: "TrendCharts",
count: 0, // count: 0,
}, // },
{ {
name: "putStorage", name: "putStorage",
title: "入库登记", title: "入库登记",

View File

@ -89,13 +89,13 @@ const testObj = {
"reservation_time": null, "reservation_time": null,
"is_writeoff": 1, "is_writeoff": 1,
"is_remind": 0, "is_remind": 0,
"create_time": "2024-06-08 16:04:16", "create_time": "2024-00-08 16:04:16",
"update_time": "2024-06-08 16:56:23", "update_time": "2024-00-08 16:56:23",
"delete_time": null, "delete_time": null,
"system_store_name": "店铺名称", "system_store_name": "店铺名称",
"system_store_phone": "15699996666", "system_store_phone": "156****6666",
"staff_name": "新店阿萨", "staff_name": "新店阿萨",
"staff_phone": "15699996666", "staff_phone": "156****6666",
"nickname": "", "nickname": "",
"user_mobile": "", "user_mobile": "",
"info": [ "info": [

95
src/utils/feedback.ts Normal file
View File

@ -0,0 +1,95 @@
import {
ElMessage,
ElMessageBox,
ElNotification,
ElLoading,
type ElMessageBoxOptions
} from 'element-plus'
import type { LoadingInstance } from 'element-plus/es/components/loading/src/loading'
export class Feedback {
private loadingInstance: LoadingInstance | null = null
static instance: Feedback | null = null
static getInstance() {
return this.instance ?? (this.instance = new Feedback())
}
// 消息提示
msg(msg: string) {
ElMessage.info(msg)
}
// 错误消息
msgError(msg: string) {
if(msg!=='Network Error') ElMessage.error(msg)
}
// 成功消息
msgSuccess(msg: string) {
ElMessage.success(msg)
}
// 警告消息
msgWarning(msg: string) {
ElMessage.warning(msg)
}
// 弹出提示
alert(msg: string) {
ElMessageBox.alert(msg, '系统提示')
}
// 错误提示
alertError(msg: string) {
ElMessageBox.alert(msg, '系统提示', { type: 'error' })
}
// 成功提示
alertSuccess(msg: string) {
ElMessageBox.alert(msg, '系统提示', { type: 'success' })
}
// 警告提示
alertWarning(msg: string) {
ElMessageBox.alert(msg, '系统提示', { type: 'warning' })
}
// 通知提示
notify(msg: string) {
ElNotification.info(msg)
}
// 错误通知
notifyError(msg: string) {
ElNotification.error(msg)
}
// 成功通知
notifySuccess(msg: string) {
ElNotification.success(msg)
}
// 警告通知
notifyWarning(msg: string) {
ElNotification.warning(msg)
}
// 确认窗体
confirm(msg: string) {
return ElMessageBox.confirm(msg, '温馨提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
})
}
// 提交内容
prompt(content: string, title: string, options?: ElMessageBoxOptions) {
return ElMessageBox.prompt(content, title, {
confirmButtonText: '确定',
cancelButtonText: '取消',
...options
})
}
// 打开全局loading
loading(msg: string) {
this.loadingInstance = ElLoading.service({
lock: true,
text: msg
})
}
// 关闭全局loading
closeLoading() {
this.loadingInstance?.close()
}
}
const feedback = Feedback.getInstance()
export default feedback

View File

@ -8,20 +8,22 @@ const orderList = ref([]);
const where = ref({ const where = ref({
page_no: 1, page_no: 1,
page_size: 20, page_size: 20,
loadend: false loadend: false,
type: 1
}); });
const loading = ref(false); const loading = ref(false);
const getOrderList = () => { const getOrderList = () => {
if(where.value.loadend) return ; if (where.value.loadend) return;
loading.value = true; loading.value = true;
storeStorageInfoListsApi({ storeStorageInfoListsApi({
page_no: where.value.page_no, page_no: where.value.page_no,
page_size: where.value.page_size page_size: where.value.page_size,
type: where.value.type
}).then((res) => { }).then((res) => {
orderList.value = [...orderList.value, ...res.data.lists]; orderList.value = [...orderList.value, ...res.data.lists];
if(res.data.lists.length<where.value.page_size) where.value.loadend = true; if (res.data.lists.length < where.value.page_size) where.value.loadend = true;
where.value.page_no++; where.value.page_no++;
loading.value = false; loading.value = false;
}); });
@ -29,6 +31,17 @@ const getOrderList = () => {
getOrderList(); getOrderList();
const reload = ()=>{
where.value.page_no = 1;
where.value.loadend = false;
orderList.value = [];
getOrderList();
};
//
const handlePutStorage = (data) => {
}
// //
const handleEdit = async (data) => { const handleEdit = async (data) => {
storeStorageInfoEditApi({ storeStorageInfoEditApi({
@ -43,25 +56,23 @@ const handleEdit = async (data) => {
<template> <template>
<div class="my-card put-storage"> <div class="my-card put-storage">
<div <el-radio-group style="margin-bottom: 20px" v-model="where.type" @change="reload">
class="order-lists" <el-radio-button :label="1" :value="1">售卖库存</el-radio-button>
v-loading="loading" <el-radio-button :label="2" :value="2">兑换库存</el-radio-button>
v-infinite-scroll="getOrderList" </el-radio-group>
:infinite-scroll-distance="300" <div class="order-lists" v-loading="loading" v-infinite-scroll="getOrderList" :infinite-scroll-distance="300"
:infinite-scroll-delay="500" :infinite-scroll-delay="500" :infinite-scroll-immediate="false" style="overflow: auto">
:infinite-scroll-immediate="false" <el-table :data="orderList">
style="overflow: auto">
<el-table :data="orderList" >
<el-table-column label="导入人员" prop="admin_name" /> <el-table-column label="导入人员" prop="admin_name" />
<el-table-column label="门店确认人员" prop="staff_name" /> <el-table-column label="门店确认人员" prop="staff_name" />
<el-table-column label="商品图" prop="image" > <el-table-column label="商品图" prop="image">
<template #default="{ row }"> <template #default="{ row }">
<el-image class="image" :src="row.image" /> <el-image class="image" :src="row.image" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="商品" prop="store_name" /> <el-table-column label="商品" prop="store_name" />
<el-table-column label="数量" prop="nums" /> <el-table-column label="数量" prop="nums" />
<el-table-column label="状态" prop="status" > <el-table-column label="状态" prop="status">
<template #default="{ row }"> <template #default="{ row }">
<el-tag type="success" v-if="row.status === 1">已入库</el-tag> <el-tag type="success" v-if="row.status === 1">已入库</el-tag>
<el-tag type="warning" v-else-if="row.status === 0">待确认</el-tag> <el-tag type="warning" v-else-if="row.status === 0">待确认</el-tag>
@ -71,8 +82,7 @@ const handleEdit = async (data) => {
<el-table-column label="备注" prop="mark" /> <el-table-column label="备注" prop="mark" />
<el-table-column label="操作" width="120" fixed="right"> <el-table-column label="操作" width="120" fixed="right">
<template #default="{ row }"> <template #default="{ row }">
<el-button v-if="row.status == 0" <el-button v-if="row.status == 0" type="success" @click="handleEdit(row)">
type="success" @click="handleEdit(row)">
确认入库 确认入库
</el-button> </el-button>
</template> </template>
@ -89,14 +99,17 @@ const handleEdit = async (data) => {
box-sizing: border-box; box-sizing: border-box;
padding: 1rem; padding: 1rem;
height: 100%; height: 100%;
display: flex;
flex-direction: column;
.image{ .image {
width: 4rem; width: 4rem;
height: 4rem; height: 4rem;
} }
.order-lists{
height: 100%; .order-lists {
flex: 1;
width: 100%; width: 100%;
} }
} }

View File

@ -4,6 +4,7 @@ import { cartListApi, cartDeleteApi, cartCreateApi } from "@/api/store.js";
import price from "./price.vue"; import price from "./price.vue";
import mitt from "@/utils/mitt.js"; import mitt from "@/utils/mitt.js";
import { useUserStore } from "@/store/user.js"; import { useUserStore } from "@/store/user.js";
import userList from "@/components/userList.vue";
const list = ref([]); const list = ref([]);
const allPrice = ref(0); // const allPrice = ref(0); //
@ -11,6 +12,7 @@ const costPrice = ref(0); //商品原价
const discounts = ref(0); // const discounts = ref(0); //
const userStore = useUserStore(); const userStore = useUserStore();
const userListRef = ref(null);
const clearAll = () => { const clearAll = () => {
let id = []; let id = [];
@ -91,11 +93,20 @@ const showPrice = (type = true) => {
priceRef.value.show(type, costPrice.value); priceRef.value.show(type, costPrice.value);
}; };
const userInfo = ref({
uid: ''
})
const setUser = (row)=>{
userInfo.value = row;
userInfo.value.uid = row.id;
}
defineExpose({ defineExpose({
getList, getList,
list, list,
discounts, discounts,
allPrice, allPrice,
userInfo
}); });
// //
@ -119,6 +130,28 @@ onUnmounted(() => {
<template> <template>
<div class="my-order"> <div class="my-order">
<div class="user-nav">
<div class="user-info">
<el-avatar class="avatar" :src="userInfo.avatar" />
<div class="info" v-if="userInfo.uid">
<div class="flex-bewteen">
<div>手机号: {{ userInfo.account }}</div>
<el-button type="primary" link class="change-user" @click="userListRef.open()">切换用户<el-icon><ArrowRight /></el-icon></el-button>
</div>
<div class="flex-bewteen" style="align-items: flex-end;">
<div>采购款: {{ userInfo.purchase_funds }}</div>
<el-button link @click="userInfo.uid=''">重置<el-icon><RefreshLeft /></el-icon></el-button>
</div>
</div>
<div class="info" v-else style="align-items: center;display:flex;justify-content: space-between;">
<div class="flex-bewteen" style="width:100%;">
<div style="font-size: 1.2rem;">游客</div>
<el-button type="primary" link class="change-user" @click="userListRef.open()">切换用户<el-icon><ArrowRight /></el-icon></el-button>
</div>
</div>
</div>
<userList ref="userListRef" @setUser="setUser" />
</div>
<div class="header-nav"> <div class="header-nav">
<div class="nav-item"> <div class="nav-item">
已选购 <span>{{ list.length }}</span> 已选购 <span>{{ list.length }}</span>
@ -206,6 +239,37 @@ onUnmounted(() => {
width: 30rem; width: 30rem;
position: relative; position: relative;
overflow: hidden; overflow: hidden;
display: flex;
flex-direction: column;
.user-nav{
.user-info{
padding: 1rem;
margin: 1rem;
margin-bottom: 0;
border: 2px solid #f70;
background-color: rgba($color: #f70, $alpha: 0.1);
border-radius: 0.5rem;
display: flex;
.avatar {
width: 3rem;
height: 3rem;
flex-shrink: 0;
}
.info{
flex: 1;
margin-left: 1rem;
color: #666;
.flex-bewteen{
display: flex;
justify-content: space-between;
}
.change-user{
font-size: 1rem;
}
}
}
}
.header-nav { .header-nav {
display: flex; display: flex;
@ -225,8 +289,9 @@ onUnmounted(() => {
} }
} }
.order-list { .order-list {
height: calc(100vh - 100px - 14rem); flex: 1;
overflow-y: auto; overflow-y: auto;
padding-bottom: 10rem;
.order-item { .order-item {
display: flex; display: flex;
padding: 1rem; padding: 1rem;
@ -273,8 +338,10 @@ onUnmounted(() => {
position: absolute; position: absolute;
bottom: 0; bottom: 0;
left: 0; left: 0;
z-index: 20;
width: 100%; width: 100%;
box-shadow: 0 -1px 0.625rem #eee; box-shadow: 0 -1px 0.625rem #eee;
background-color: #fff;
.order-total { .order-total {
height: 2.5rem; height: 2.5rem;

View File

@ -104,6 +104,7 @@ const checkOut = () => {
payRef.value.setForm({ payRef.value.setForm({
data: res.data.order, data: res.data.order,
cart_id: cart_id, cart_id: cart_id,
uid: orderRef.value?.userInfo?.uid || ""
}); });
}); });
}; };

View File

@ -4,7 +4,6 @@ import { apiProvince, apiCity, apiArea, apiStreet, apiVillage, apiBrigade } from
import { userShipApi, userAddApi } from "@/api/user" import { userShipApi, userAddApi } from "@/api/user"
import { ElMessage } from "element-plus"; import { ElMessage } from "element-plus";
const options = ref([]);
const formDataRef = ref(null); const formDataRef = ref(null);
const formDataInfo = reactive({ const formDataInfo = reactive({
@ -26,6 +25,7 @@ const formDataRules = reactive({
] ]
}) })
const options = ref([]);
// //
const loadOptions = async (node, resolve) => { const loadOptions = async (node, resolve) => {
const level = node.level; const level = node.level;
@ -110,7 +110,7 @@ const props = {
const userShip = ref([]) const userShip = ref([])
const getUserShip = () => { const getUserShip = () => {
userShipApi().then(res => { userShipApi().then(res => {
userShip.value = res.data.lists userShip.value = res.data.lists;
}) })
} }
getUserShip() getUserShip()
@ -150,7 +150,7 @@ defineExpose({
</el-form-item> </el-form-item>
<el-form-item label="会员类型" prop="user_ship"> <el-form-item label="会员类型" prop="user_ship">
<el-select v-model="formDataInfo.user_ship" placeholder="请选择会员类型" style="width: 100%;"> <el-select v-model="formDataInfo.user_ship" placeholder="请选择会员类型" style="width: 100%;">
<el-option v-for="item in userShip" :key="item.id" :label="item.title" :value="item.id" /> <el-option v-for="item in userShip" :key="item.id" :label="item.title" :value="item.id" :disabled="item.id==1" />
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="用户地址" prop="selectedValues"> <el-form-item label="用户地址" prop="selectedValues">

View File

@ -4,7 +4,9 @@ import { useUserStore } from "@/store/user.js";
import { ElMessage } from "element-plus"; import { ElMessage } from "element-plus";
import { useRouter } from "vue-router"; import { useRouter } from "vue-router";
import mitt from "@/utils/mitt.js"; import mitt from "@/utils/mitt.js";
import pay from "@/components/pay.vue"; import payUser from "@/components/payUser.vue";
import { userAddressDetailApi, userAddressEditApi, userDetailApi } from "@/api/user"
import { apiProvince, apiCity, apiArea, apiStreet, apiVillage, apiBrigade } from '@/api/public'
const userStore = useUserStore(); const userStore = useUserStore();
const router = useRouter(); const router = useRouter();
@ -13,14 +15,171 @@ const formData = ref({
id: "", id: "",
}); });
const payInfo = ref({
price: '',
type: 1,
})
const payRef = ref(null);
const toPay = () => {
if (payInfo.value.type == 1) payInfo.value.price = '1000';
else if (payInfo.value.type == 2) payInfo.value.price = '2000';
else if (payInfo.value.type == 3) payInfo.value.price = '5000';
// if (Number(payInfo.value.price) < 1000 && formData.value.user_ship != 1) return ElMessage.error('1000');
if (payInfo.value.type == 0) payInfo.value.price = Number(payInfo.value.price).toFixed(2);
console.log('支付', payInfo.value);
payRef.value.setForm({
data: {
uid: formData.value.id,
price: payInfo.value.price,
}
});
payRef.value.drawer = true;
}
const paySuccess = () => {
console.log('支付成功');
mitt.emit('re-load-user-list');
}
const addressInfo = ref({
id: '',
province: '',
city: '',
area: '',
street: '',
brigade: ''
})
const selectedValues = ref([])
const selectedEd = ref([])
const getAddress = () => {
userAddressDetailApi({
uid: formData.value.id
}).then(res => {
if (res.data.village) {
selectedValues.value = [res.data.city, res.data.area, res.data.street, res.data.village, +res.data.brigade];
selectedEd.value = JSON.parse(JSON.stringify(selectedValues.value));
addressInfo.value = Object.assign(addressInfo.value, res.data);
}
})
}
const options = ref([]);
//
const loadOptions = async (node, resolve) => {
const level = node.level;
let response;
if (level !== 0 && !node.data.code) return resolve([]);
// if (level === 0) {
// response = await apiProvince();
// response = response.data.map((item) => {
// return {
// code: item.province_code,
// name: item.province_name
// }
// })
// } else
if (level === 0) {
response = await apiCity({
province_code: 510000 //
});
response = response.data.map((item) => {
return {
code: item.city_code,
name: item.city_name
}
})
} else if (level === 1) {
response = await apiArea({
city_code: node.data.code
});
response = response.data.map((item) => {
return {
code: item.area_code,
name: item.area_name
}
})
}
else if (level === 2) {
response = await apiStreet({
area_code: node.data.code
});
response = response.data.map((item) => {
return {
code: item.street_code,
name: item.street_name,
}
})
}
else if (level === 3) {
response = await apiVillage({
street_code: node.data.code
});
response = response.data.map((item) => {
return {
code: item.village_code,
name: item.village_name,
}
})
}
else if (level === 4) {
response = await apiBrigade({
village_code: node.data.code
});
response = response.data.map((item) => {
return {
code: item.id,
name: item.brigade_name,
leaf: true
}
})
}
resolve(response);
};
const props = {
value: 'code',
label: 'name',
children: 'children',
multiple: false,
lazy: true,
lazyLoad: loadOptions
};
const updateAddress = async () => {
addressInfo.value.city = selectedValues.value[0]
addressInfo.value.area = selectedValues.value[1]
addressInfo.value.street = selectedValues.value[2]
addressInfo.value.village = selectedValues.value[3]
addressInfo.value.brigade = selectedValues.value[4]
if (!addressInfo.value.phone) addressInfo.value.phone = formData.value.account;
if (!addressInfo.value.real_name) addressInfo.value.real_name = formData.value.real_name || formData.value.nickname;
userAddressEditApi({
...addressInfo.value,
uid: formData.value.id
}).then(res => {
ElMessage.success('编辑成功')
isDisabled.value = true;
})
}
const cancelUpdate = () => {
selectedValues.value = JSON.parse(JSON.stringify(selectedEd.value))
isDisabled.value = true;
}
const isDisabled = ref(true);
onMounted(() => { onMounted(() => {
mitt.on("set-user-detail", (res) => { mitt.on("set-user-detail", (res) => {
console.log("===", res);
formData.value = res; formData.value = res;
where.value.page_no = 1; userDetailApi({
where.value.loadend = false; id: res.id
where.value.loading = false; }).then(({ data }) => {
goods_list.value = []; formData.value = Object.assign(res, data);
console.log(formData.value);
})
getAddress();
}); });
}); });
@ -32,9 +191,21 @@ onUnmounted(() => {
<template> <template>
<div class="my-order"> <div class="my-order">
<div class="detail" v-if="formData.id"> <div class="detail" v-if="formData.id">
<div class="table" > <div class="table">
<div class="table-title">用户信息</div> <div class="table-title">用户信息</div>
<div class="table-info"> <div class="table-info">
<div class="info-item">
<div class="info-item-title">用户余额:</div>
<div class="info-item-info red">¥{{ formData.now_money }}</div>
</div>
<div class="info-item">
<div class="info-item-title">采购款:</div>
<div class="info-item-info red">¥{{ formData.purchase_funds }}</div>
</div>
<div class="info-item">
<div class="info-item-title">待返还金额:</div>
<div class="info-item-info red">¥{{ formData.number }}</div>
</div>
<div class="info-item"> <div class="info-item">
<div class="info-item-title">头像:</div> <div class="info-item-title">头像:</div>
<div class="info-item-info"> <div class="info-item-info">
@ -61,23 +232,67 @@ onUnmounted(() => {
<div class="info-item-title">创建时间:</div> <div class="info-item-title">创建时间:</div>
<div class="info-item-info">{{ formData.create_time }}</div> <div class="info-item-info">{{ formData.create_time }}</div>
</div> </div>
<div class="info-item"> <div class="info-item" style="width: 100%;flex-shrink: 0;align-items: center;">
<div class="info-item-title">用户类型:</div> <div class="info-item-title">用户类型:</div>
<div class="info-item-info"> <div class="info-item-info">
<el-tag type="primary" v-if="formData.user_ship==0">{{ formData.user_ship_name }}</el-tag> <template v-if="updateShip == false">
<el-tag type="primary" v-if="formData.user_ship == 0">{{ formData.user_ship_name
}}</el-tag>
<el-tag type="success" v-else>{{ formData.user_ship_name }}</el-tag> <el-tag type="success" v-else>{{ formData.user_ship_name }}</el-tag>
<el-button v-if="isDisabled" type="primary" style="margin-left: 1rem;" size="small"
@click="isDisabled = false">修改</el-button>
</template>
<template v-else>
<el-select v-model="formDataInfo.user_ship" placeholder="请选择会员类型" style="width: 100%;">
<el-option v-for="item in userShip" :key="item.id" :label="item.title"
:value="item.id" :disabled="item.id == 1" />
</el-select>
<el-button v-if="!isDisabled" type="primary" style="margin-left: 1rem;"
@click="updateAddress">确认</el-button>
<el-button v-if="!isDisabled" style="margin-left: 1rem;"
@click="cancelUpdate">取消</el-button>
</template>
</div> </div>
</div> </div>
<div class="info-item"> <div class="info-item" style="width: 100%;flex-shrink: 0;align-items: center;">
<div class="info-item-title">用户余额:</div> <div class="info-item-title">用户地址:</div>
<div class="info-item-info">¥{{ formData.user_money }}</div> <el-cascader :key="formData.id" style="flex: 1;" v-model="selectedValues" :options="options"
:props="props" :load="loadOptions" class="w-full" :disabled="isDisabled" />
<el-button v-if="isDisabled" type="primary" style="margin-left: 1rem;"
@click="isDisabled = false">修改</el-button>
<el-button v-if="!isDisabled" type="primary" style="margin-left: 1rem;"
@click="updateAddress">确认</el-button>
<el-button v-if="!isDisabled" style="margin-left: 1rem;" @click="cancelUpdate">取消</el-button>
</div> </div>
</div> </div>
<div class="table-title">供销经营礼包<span class="tips">首次购买1000元以上成为行业会员</span></div>
<div class="table-info">
<div class="pay-btn">
<div class="pay-item" :class="{ 'pay-item-active': payInfo.type == 1 }"
@click="payInfo.type = 1">
<div>¥1000.00</div>
</div>
<div class="pay-item" :class="{ 'pay-item-active': payInfo.type == 2 }"
@click="payInfo.type = 2">
<div>¥2000.00</div>
</div>
<div class="pay-item" :class="{ 'pay-item-active': payInfo.type == 3 }"
@click="payInfo.type = 3">
<div>¥5000.00</div>
</div>
<div class="pay-item" :class="{ 'pay-item-active': payInfo.type == 0 }"
@click="payInfo.type = 0">
<input type="number" class="input" v-model="payInfo.price" placeholder="自定义金额">
</div>
</div>
<el-button type="primary" size="large" class="pay" @click="toPay">立即支付</el-button>
</div>
</div> </div>
</div> </div>
<div v-else> <div v-else>
<el-empty></el-empty> <el-empty></el-empty>
</div> </div>
<payUser ref="payRef" @paySuccess="paySuccess"></payUser>
</div> </div>
</template> </template>
@ -104,6 +319,13 @@ onUnmounted(() => {
.table-title { .table-title {
font-weight: bold; font-weight: bold;
.tips {
font-weight: 400;
color: #999;
font-size: 0.8rem;
margin-left: 1rem;
}
} }
.table-info { .table-info {
@ -124,11 +346,67 @@ onUnmounted(() => {
display: flex; display: flex;
padding-top: 1rem; padding-top: 1rem;
.red {
color: #ff4a00;
}
.info-item-title { .info-item-title {
flex-shrink: 0; flex-shrink: 0;
padding-right: 1rem; padding-right: 1rem;
} }
} }
.pay-btn {
width: 100%;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
margin-bottom: 1rem;
.pay-item {
flex: 1;
min-width: 10rem;
margin: 1rem 0.5rem 0 0.5rem;
height: 5rem;
background-color: rgba($color: #67c23a, $alpha: 0.1);
color: #67c23a;
border-radius: 1rem;
border: 2px solid #67c23a;
cursor: pointer;
display: flex;
justify-content: center;
align-items: center;
font-size: 1.5rem;
font-size: 1.5rem;
display: flex;
justify-content: center;
align-items: center;
.input {
font-size: 1.5rem;
width: 100%;
height: 100%;
text-align: center;
color: #67c23a;
}
&-active {
background-color: #67c23a;
color: #fff;
.input {
color: #fff;
}
}
}
}
.pay {
width: 100%;
border-radius: 3rem;
margin: 0.5rem;
}
} }
} }
@ -147,5 +425,23 @@ onUnmounted(() => {
border-top: 1px solid #eee; border-top: 1px solid #eee;
} }
} }
input[type="number"] {
/* 移除边框 */
border: none;
/* 移除内边距 */
padding: 0;
/* 移除默认背景颜色 */
background-color: transparent;
/* 移除聚焦时的轮廓 */
outline: none;
/* 重置文本填充色,防止某些浏览器对自动填充的文本颜色有特殊样式 */
-webkit-text-fill-color: inherit;
/* 适用于Webkit内核浏览器 */
-webkit-appearance: none;
/* 针对Webkit内核移除一些特殊样式 */
/* 防止输入框在聚焦时出现阴影或特殊样式 */
box-shadow: none;
}
} }
</style> </style>

View File

@ -24,15 +24,10 @@ const props = defineProps({
const lists = ref([]); const lists = ref([]);
const where = ref({ const where = ref({
page_no: 1, page_no: 1,
page_size: 20, page_size: 20,
order_id: "", mobile: "",
start_time: "",
end_time: "",
is_sashier: 2, // 1-, 2-
}); });
const loading = ref(false); const loading = ref(false);
@ -72,6 +67,20 @@ const addRef = ref(null);
const addUser = ()=>{ const addUser = ()=>{
addRef.value?.addUser(); addRef.value?.addUser();
} }
const addSuccess = ()=>{
dialogVisible.value = false;
getOrderList(true);
}
onMounted(()=>{
mitt.on('re-load-user-list', ()=>{
getOrderList(true);
})
})
onUnmounted(()=>{
mitt.off('re-load-user-list');
})
</script> </script>
<template> <template>
@ -85,7 +94,7 @@ const addUser = ()=>{
</el-icon> </el-button> </el-icon> </el-button>
</div> </div>
<div class="header-input"> <div class="header-input">
<el-input v-model="where.order_id" placeholder="搜索手机号/ID" @keydown.enter="getOrderList(true)" <el-input v-model="where.mobile" placeholder="搜索手机号/ID" @keydown.enter="getOrderList(true)"
@clear="getOrderList(true)" clearable> @clear="getOrderList(true)" clearable>
<template #append> <template #append>
<el-button type="primary" style=" <el-button type="primary" style="
@ -108,9 +117,11 @@ const addUser = ()=>{
</div> </div>
<div class="bottom flex" style="justify-content: space-between;"> <div class="bottom flex" style="justify-content: space-between;">
<!-- <div class="r-1">积分: <span class="red">55</span></div> --> <!-- <div class="r-1">积分: <span class="red">55</span></div> -->
<div>余额: <span class="red">{{item.user_money}}</span></div> <div>余额: <span class="red">{{item.now_money}}</span></div>
<div>采购款: <span class="red">{{item.purchase_funds}}</span></div>
<div>待返还: <span class="red">{{item.return_money}}</span></div>
<div> <div>
<el-tag type="primary" v-if="item.user_ship==0">{{ item.user_ship_name }}</el-tag> <el-tag type="primary" v-if="item.user_ship!=1">{{ item.user_ship_name }}</el-tag>
<el-tag type="success" v-else>{{ item.user_ship_name }}</el-tag> <el-tag type="success" v-else>{{ item.user_ship_name }}</el-tag>
</div> </div>
</div> </div>
@ -120,7 +131,7 @@ const addUser = ()=>{
<div v-if="loading" class="load-end">加载中...</div> <div v-if="loading" class="load-end">加载中...</div>
</div> </div>
<el-dialog v-model="dialogVisible" title="添加用户" width="600"> <el-dialog v-model="dialogVisible" title="添加用户" width="600">
<add ref="addRef" @close="dialogVisible = false"></add> <add ref="addRef" @close="addSuccess"></add>
<template #footer> <template #footer>
<div class="dialog-footer"> <div class="dialog-footer">
<el-button @click="dialogVisible = false">取消</el-button> <el-button @click="dialogVisible = false">取消</el-button>