Merge branch 'master' of https://gitea.lihaink.cn/weipengfei/cashier-mer
This commit is contained in:
commit
a1ab6200e5
|
@ -3,8 +3,8 @@ VITE_NOW_TYPE = 'dist'
|
||||||
# VITE_PUSH_URL = 'ws://192.168.1.22:8787'
|
# VITE_PUSH_URL = 'ws://192.168.1.22:8787'
|
||||||
# VITE_BASE_URL = 'http://192.168.1.22:8545'
|
# VITE_BASE_URL = 'http://192.168.1.22:8545'
|
||||||
|
|
||||||
# VITE_PUSH_URL ='wss://erp.lihaink.cn/pull'
|
VITE_PUSH_URL ='wss://test-multi-store.lihaink.cn/pull'
|
||||||
# VITE_BASE_URL = 'https://test-multi-store.lihaink.cn'
|
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'
|
|
@ -136,6 +136,13 @@ export function cashierinfoDetailsApi(data) {
|
||||||
return request.get(`/store_order/storeOrder/detail`, { params: data })
|
return request.get(`/store_order/storeOrder/detail`, { params: data })
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @description 核销记录
|
||||||
|
*/
|
||||||
|
export function cashierinfoWriteoffListApi(data) {
|
||||||
|
return request.get(`/store_order/storeOrder/writeoff_list`, { params: data })
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @description 订单核销
|
* @description 订单核销
|
||||||
*/
|
*/
|
||||||
|
|
|
@ -84,7 +84,7 @@ const testObj = {
|
||||||
"remark": "",
|
"remark": "",
|
||||||
"mer_id": 0,
|
"mer_id": 0,
|
||||||
"verify_code": "6-******",
|
"verify_code": "6-******",
|
||||||
"shipping_type": 2,
|
"shipping_type": 2, // 1快递, 2自提
|
||||||
"reservation": 0,
|
"reservation": 0,
|
||||||
"reservation_time": null,
|
"reservation_time": null,
|
||||||
"is_writeoff": 1,
|
"is_writeoff": 1,
|
||||||
|
@ -116,7 +116,7 @@ export const printTicket = (obj = {}, test = false) => {
|
||||||
if(!obj || !obj.order_id) obj = testObj;
|
if(!obj || !obj.order_id) obj = testObj;
|
||||||
str += Esc.Size2(2) + Esc.Center() + Esc.boldFontOn() + obj.system_store_name + Esc.Size1() + "\n";
|
str += Esc.Size2(2) + Esc.Center() + Esc.boldFontOn() + obj.system_store_name + Esc.Size1() + "\n";
|
||||||
str += Esc.fillLine(" ") + Esc.boldFontOff() + "\n";
|
str += Esc.fillLine(" ") + Esc.boldFontOff() + "\n";
|
||||||
str += Esc.Left() + "核销码: " + Esc.boldFontOn() + obj.verify_code + Esc.boldFontOff() + "\n";
|
if(obj.shipping_type == 2) str += Esc.Left() + "核销码: " + Esc.boldFontOn() + obj.verify_code + Esc.boldFontOff() + "\n";
|
||||||
str += Esc.Left() + "单号: " + obj.order_id + "\n";
|
str += Esc.Left() + "单号: " + obj.order_id + "\n";
|
||||||
str += Esc.Left() + "下单时间: " + obj.create_time + "\n";
|
str += Esc.Left() + "下单时间: " + obj.create_time + "\n";
|
||||||
|
|
||||||
|
@ -128,7 +128,7 @@ export const printTicket = (obj = {}, test = false) => {
|
||||||
str += Esc.Left() + item.store_name + "\n";
|
str += Esc.Left() + item.store_name + "\n";
|
||||||
let total = +item.price || 0;
|
let total = +item.price || 0;
|
||||||
total *= +item.cart_num;
|
total *= +item.cart_num;
|
||||||
str += Esc.inline3(`${item.price || '0.00'}元`, `${item.cart_num}${item.unit_name}`, `${total}元`, " ", 1) + "\n";
|
str += Esc.inline3(`${item.price || '0.00'}元`, `${item.cart_num}${item.unit_name||''}`, `${total}元`, " ", 1) + "\n";
|
||||||
})
|
})
|
||||||
|
|
||||||
str += Esc.fillLine("=") + "\n";
|
str += Esc.fillLine("=") + "\n";
|
||||||
|
@ -137,7 +137,15 @@ export const printTicket = (obj = {}, test = false) => {
|
||||||
str += Esc.Left() + "实付款: " + obj.pay_price + "元" + "\n";
|
str += Esc.Left() + "实付款: " + obj.pay_price + "元" + "\n";
|
||||||
str += Esc.Left() + "支付方式: " + obj.pay_type_name + "\n";
|
str += Esc.Left() + "支付方式: " + obj.pay_type_name + "\n";
|
||||||
// str += Esc.Left() + "支付单号: " + obj.order_id + "\n";
|
// str += Esc.Left() + "支付单号: " + obj.order_id + "\n";
|
||||||
str += Esc.Left() + "联系电话: " + obj.system_store_phone + "\n";
|
str += Esc.Left() + "店铺电话: " + obj.system_store_phone + "\n";
|
||||||
|
|
||||||
|
if(obj.shipping_type == 1){ // 快递
|
||||||
|
str += Esc.fillLine("=") + "\n";
|
||||||
|
str += Esc.Left() + "收货人: " + obj.real_name + "\n";
|
||||||
|
str += Esc.Left() + "收货电话: " + obj.user_phone + "\n";
|
||||||
|
str += Esc.Left() + "收货地址: " + obj.user_address + "\n";
|
||||||
|
}
|
||||||
|
|
||||||
str += Esc.fillLine("=") + "\n";
|
str += Esc.fillLine("=") + "\n";
|
||||||
|
|
||||||
// 票尾
|
// 票尾
|
||||||
|
|
|
@ -3,6 +3,7 @@ import { ref, watch } from "vue";
|
||||||
import {
|
import {
|
||||||
saleOrderListApi,
|
saleOrderListApi,
|
||||||
cashierinfoDetailsApi,
|
cashierinfoDetailsApi,
|
||||||
|
cashierinfoWriteoffListApi,
|
||||||
orderStatusApi,
|
orderStatusApi,
|
||||||
orderLadingApi,
|
orderLadingApi,
|
||||||
cartListApi,
|
cartListApi,
|
||||||
|
@ -18,11 +19,21 @@ const list = ref([]);
|
||||||
|
|
||||||
const payRef = ref(null);
|
const payRef = ref(null);
|
||||||
|
|
||||||
|
const props = defineProps({
|
||||||
|
type: {
|
||||||
|
type: Number,
|
||||||
|
default: 2
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
const where = ref({
|
const where = ref({
|
||||||
verify_code: ''
|
verify_code: '',
|
||||||
|
page_no: 1,
|
||||||
|
page_size: 15
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
const loading = ref(false);
|
const loading = ref(false);
|
||||||
const total = ref(0);
|
const total = ref(0);
|
||||||
const activeStore = ref(0);
|
const activeStore = ref(0);
|
||||||
|
@ -30,36 +41,62 @@ const activeStore = ref(0);
|
||||||
const loadEnd = ref(false);
|
const loadEnd = ref(false);
|
||||||
const orderList = ref([]);
|
const orderList = ref([]);
|
||||||
const getOrderList = (reload = false) => {
|
const getOrderList = (reload = false) => {
|
||||||
where.value.verify_code = where.value.verify_code.replace('—','-')
|
// return console.log('加载');
|
||||||
where.value.verify_code = where.value.verify_code.replace(/\uFF0D/,'-')
|
if(loading.value) return;
|
||||||
where.value.verify_code = where.value.verify_code.replace(' ','')
|
loading.value = true;
|
||||||
cashierinfoDetailsApi(where.value)
|
if (where.value.verify_code) {
|
||||||
.then((res) => {
|
where.value.verify_code = where.value.verify_code.replace('—', '-');
|
||||||
orderList.value = [res.data];
|
where.value.verify_code = where.value.verify_code.replace(/\uFF0D/, '-');
|
||||||
activeStore.value = 0;
|
where.value.verify_code = where.value.verify_code.replace(' ', '');
|
||||||
mitt.emit("set-sale-order-detail", orderList.value[0]);
|
|
||||||
total.value = res.data.count;
|
cashierinfoDetailsApi({
|
||||||
if(orderList.value[0].is_writeoff) {
|
verify_code: where.value.verify_code
|
||||||
ElMessage.warning('订单已核销过')
|
|
||||||
}
|
|
||||||
})
|
})
|
||||||
.catch((err) => {
|
.then((res) => {
|
||||||
});
|
orderList.value = [res.data];
|
||||||
|
activeStore.value = 0;
|
||||||
|
mitt.emit("set-sale-order-detail", orderList.value[0]);
|
||||||
|
total.value = res.data.count;
|
||||||
|
loading.value = false;
|
||||||
|
if (orderList.value[0].is_writeoff) {
|
||||||
|
ElMessage.warning('订单已核销过')
|
||||||
|
}
|
||||||
|
})
|
||||||
|
.catch((err) => {
|
||||||
|
loading.value = false;
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
cashierinfoWriteoffListApi(where.value)
|
||||||
|
.then((res) => {
|
||||||
|
orderList.value = res.data.lists;
|
||||||
|
mitt.emit("set-sale-order-detail", orderList.value[0]);
|
||||||
|
total.value = res.data.count;
|
||||||
|
loading.value = false;
|
||||||
|
})
|
||||||
|
.catch((err) => {
|
||||||
|
loading.value = false;
|
||||||
|
});
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
};
|
};
|
||||||
|
|
||||||
const setForm = (item, index) => {
|
const setForm = (item, index) => {
|
||||||
activeStore.value = index;
|
activeStore.value = index;
|
||||||
mitt.emit("set-order-detail", item);
|
mitt.emit("set-sale-order-detail", item);
|
||||||
}
|
}
|
||||||
|
|
||||||
const setCode = (code) => {
|
const setCode = (code) => {
|
||||||
where.value.verify_code = code;
|
where.value.verify_code = code;
|
||||||
|
activeStore.value = 0;
|
||||||
getOrderList(true);
|
getOrderList(true);
|
||||||
}
|
}
|
||||||
|
|
||||||
const emit = defineEmits(["backOne"]);
|
const emit = defineEmits(["backOne"]);
|
||||||
|
|
||||||
const backOne = () => {
|
const backOne = () => {
|
||||||
|
mitt.emit("set-sale-order-detail", {});
|
||||||
|
orderList.value = [];
|
||||||
emit("backOne");
|
emit("backOne");
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -71,7 +108,7 @@ defineExpose({
|
||||||
<template>
|
<template>
|
||||||
<div class="my-order">
|
<div class="my-order">
|
||||||
<div class="header-nav">
|
<div class="header-nav">
|
||||||
<div class="nav-item">核销订单</div>
|
<div class="nav-item">{{ type == 2 ? '核销订单' : '核销记录' }}</div>
|
||||||
<div class="nav-item-clear">
|
<div class="nav-item-clear">
|
||||||
<el-button type="primary" size="small" @click="backOne">返回上一页</el-button>
|
<el-button type="primary" size="small" @click="backOne">返回上一页</el-button>
|
||||||
</div>
|
</div>
|
||||||
|
@ -87,8 +124,8 @@ defineExpose({
|
||||||
</template>
|
</template>
|
||||||
</el-input>
|
</el-input>
|
||||||
</div>
|
</div>
|
||||||
<div class="order-lists" v-loading="loading" :infinite-scroll-distance="300" :infinite-scroll-delay="500"
|
<div class="order-lists" v-loading="loading" v-infinite-scroll="getOrderList" :infinite-scroll-distance="300"
|
||||||
style="overflow: auto">
|
:infinite-scroll-delay="500" :infinite-scroll-immediate="false" style="overflow: auto">
|
||||||
<div class="item" :class="{ 'item-active': activeStore == index }" v-for="(item, index) in orderList"
|
<div class="item" :class="{ 'item-active': activeStore == index }" v-for="(item, index) in orderList"
|
||||||
:key="index" @click="setForm(item, index)">
|
:key="index" @click="setForm(item, index)">
|
||||||
<div class="top">
|
<div class="top">
|
||||||
|
@ -97,8 +134,8 @@ defineExpose({
|
||||||
</div>
|
</div>
|
||||||
<div class="shop">
|
<div class="shop">
|
||||||
<div class="left" v-if="item.product">
|
<div class="left" v-if="item.product">
|
||||||
<el-image v-for="(shop, imgkey) in item.product.slice(0, 5)" :key="imgkey" :src="shop.cart_info.image"
|
<el-image v-for="(shop, imgkey) in item.product.slice(0, 5)" :key="imgkey"
|
||||||
class="shop-img"></el-image>
|
:src="shop.cart_info.image" class="shop-img"></el-image>
|
||||||
<div v-if="item.product.length == 1" class="shop-name">
|
<div v-if="item.product.length == 1" class="shop-name">
|
||||||
{{ item.product[0].store_name }}
|
{{ item.product[0].store_name }}
|
||||||
</div>
|
</div>
|
||||||
|
@ -112,18 +149,19 @@ defineExpose({
|
||||||
<div class="pay">
|
<div class="pay">
|
||||||
<div v-if="item.paid">
|
<div v-if="item.paid">
|
||||||
{{ item.paid_name }}
|
{{ item.paid_name }}
|
||||||
<span v-if="item.pay_type == 9">(微信收款)</span>
|
<spna v-if="item.pay_type_name">({{ item.pay_type_name }})</spna>
|
||||||
<span v-if="item.pay_type == 17">(现金支付)</span>
|
<span v-else-if="item.pay_type == 9">(微信收款)</span>
|
||||||
<span v-if="item.pay_type == 13">(支付宝收款)</span>
|
<span v-else-if="item.pay_type == 17">(现金支付)</span>
|
||||||
<span v-if="item.pay_type == 3">(余额支付)</span>
|
<span v-else-if="item.pay_type == 13">(支付宝收款)</span>
|
||||||
<span v-if="item.pay_type == 1">(微信支付)</span>
|
<span v-else-if="item.pay_type == 3">(余额支付)</span>
|
||||||
|
<span v-else-if="item.pay_type == 1">(微信支付)</span>
|
||||||
</div>
|
</div>
|
||||||
<div v-else style="color: #ff4a00">{{ item.paid_name }}</div>
|
<div v-else style="color: #ff4a00">{{ item.paid_name }}</div>
|
||||||
</div>
|
</div>
|
||||||
<!-- <div class="cashier" v-if="item.service_info">
|
<!-- <div class="cashier" v-if="item.service_info">
|
||||||
收银员: {{ item.service_info.nickname }}
|
收银员: {{ item.service_info.nickname }}
|
||||||
</div> -->
|
</div> -->
|
||||||
<div class="cashier" v-if="item.is_writeoff==0">核销码:{{ item.verify_code }}</div>
|
<div class="cashier" v-if="item.is_writeoff == 0">核销码:{{ item.verify_code }}</div>
|
||||||
<div class="cashier" v-else style="color: #ff4a00">已核销:{{ item.verify_code }}</div>
|
<div class="cashier" v-else style="color: #ff4a00">已核销:{{ item.verify_code }}</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -141,6 +179,8 @@ defineExpose({
|
||||||
width: 30rem;
|
width: 30rem;
|
||||||
position: relative;
|
position: relative;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
|
||||||
.header-nav {
|
.header-nav {
|
||||||
display: flex;
|
display: flex;
|
||||||
|
@ -148,6 +188,10 @@ defineExpose({
|
||||||
padding: 1rem;
|
padding: 1rem;
|
||||||
height: 1.5rem;
|
height: 1.5rem;
|
||||||
|
|
||||||
|
.nav-item {
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
span {
|
span {
|
||||||
color: #ff4a00;
|
color: #ff4a00;
|
||||||
}
|
}
|
||||||
|
@ -168,7 +212,7 @@ defineExpose({
|
||||||
}
|
}
|
||||||
|
|
||||||
.order-lists {
|
.order-lists {
|
||||||
height: calc(100vh - 100px - 10.2rem);
|
flex: 1;
|
||||||
overflow-y: auto;
|
overflow-y: auto;
|
||||||
|
|
||||||
.item {
|
.item {
|
||||||
|
|
|
@ -11,110 +11,135 @@ const inputRef = ref(null);
|
||||||
const orderRef = ref(null);
|
const orderRef = ref(null);
|
||||||
|
|
||||||
const handleEnterKey = () => {
|
const handleEnterKey = () => {
|
||||||
if(code.value == "") return ElMessage.error("请输入订单编号");
|
if (code.value == "") return ElMessage.error("请输入订单编号");
|
||||||
type.value = 2;
|
type.value = 2;
|
||||||
nextTick(() => {
|
nextTick(() => {
|
||||||
orderRef.value.setCode(code.value);
|
orderRef.value.setCode(code.value);
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
const reInit = ()=>{
|
const handleListed = () => {
|
||||||
handleEnterKey();
|
type.value = 3;
|
||||||
|
nextTick(() => {
|
||||||
|
orderRef.value.setCode('');
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
const reInit = () => {
|
||||||
|
handleEnterKey();
|
||||||
}
|
}
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
nextTick(() => {
|
nextTick(() => {
|
||||||
inputRef.value.focus();
|
inputRef.value.focus();
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div class="my-card">
|
<div class="my-card">
|
||||||
<div class="my-code" v-show="type == 1">
|
<div class="my-code" v-show="type == 1">
|
||||||
<h2>订单核销</h2>
|
<h2>订单核销</h2>
|
||||||
<div class="box">
|
<div class="box">
|
||||||
<input
|
<input ref="inputRef" v-model="code" placeholder="" class="input" @keyup.enter="handleEnterKey" />
|
||||||
ref="inputRef"
|
<div class="btn" @click="handleEnterKey">查询</div>
|
||||||
v-model="code"
|
</div>
|
||||||
placeholder=""
|
<div class="to-list" @click="handleListed">
|
||||||
class="input"
|
<span>查看核销记录</span><el-icon><ArrowRightBold /></el-icon>
|
||||||
@keyup.enter="handleEnterKey"
|
</div>
|
||||||
/>
|
</div>
|
||||||
<div class="btn" @click="handleEnterKey">查询</div>
|
<order v-show="type != 1" :type="type" style="flex-shrink: 0" ref="orderRef" @backOne="type = 1" />
|
||||||
</div>
|
<padding v-show="type != 1" />
|
||||||
|
<detail v-show="type != 1" ref="detailRef" @reInit="reInit" />
|
||||||
</div>
|
</div>
|
||||||
<order v-show="type == 2" style="flex-shrink: 0" ref="orderRef" @backOne="type=1"/>
|
|
||||||
<padding v-show="type == 2" />
|
|
||||||
<detail v-show="type == 2" ref="detailRef" @reInit="reInit"/>
|
|
||||||
</div>
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style lang="scss">
|
<style lang="scss">
|
||||||
.my-card {
|
.my-card {
|
||||||
display: flex;
|
|
||||||
.my-code {
|
|
||||||
height: 70%;
|
|
||||||
width: 100%;
|
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
.box {
|
|
||||||
width: 38rem;
|
|
||||||
position: relative;
|
|
||||||
|
|
||||||
.input {
|
.my-code {
|
||||||
|
height: 70%;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 3rem;
|
|
||||||
box-sizing: border-box;
|
|
||||||
border-radius: 4rem;
|
|
||||||
border: 1px solid #1890ff;
|
|
||||||
padding: 0 1rem;
|
|
||||||
font-size: 1.1rem;
|
|
||||||
|
|
||||||
&:focus {
|
|
||||||
outline: none;
|
|
||||||
box-shadow: 0 0 0.31rem #1890ff; /* 可选:添加阴影效果以突出显示聚焦状态 */
|
|
||||||
transition: all 0.2s ease-in-out;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.btn {
|
|
||||||
position: absolute;
|
|
||||||
right: 0;
|
|
||||||
top: 0;
|
|
||||||
width: 5rem;
|
|
||||||
height: 100%;
|
|
||||||
border-radius: 0 4rem 4rem 0;
|
|
||||||
background: #1890ff;
|
|
||||||
color: #fff;
|
|
||||||
display: flex;
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
cursor: pointer;
|
|
||||||
}
|
.box {
|
||||||
|
width: 38rem;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
.input {
|
||||||
|
width: 100%;
|
||||||
|
height: 3rem;
|
||||||
|
box-sizing: border-box;
|
||||||
|
border-radius: 4rem;
|
||||||
|
border: 1px solid #1890ff;
|
||||||
|
padding: 0 1rem;
|
||||||
|
font-size: 1.1rem;
|
||||||
|
|
||||||
|
&:focus {
|
||||||
|
outline: none;
|
||||||
|
box-shadow: 0 0 0.31rem #1890ff;
|
||||||
|
/* 可选:添加阴影效果以突出显示聚焦状态 */
|
||||||
|
transition: all 0.2s ease-in-out;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn {
|
||||||
|
position: absolute;
|
||||||
|
right: 0;
|
||||||
|
top: 0;
|
||||||
|
width: 5rem;
|
||||||
|
height: 100%;
|
||||||
|
border-radius: 0 4rem 4rem 0;
|
||||||
|
background: #1890ff;
|
||||||
|
color: #fff;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.to-list {
|
||||||
|
width: auto;
|
||||||
|
color: #1890ff;
|
||||||
|
font-size: 1.1rem;
|
||||||
|
margin-top: 3rem;
|
||||||
|
text-align: center;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/* 修改滚动条的样式 */
|
/* 修改滚动条的样式 */
|
||||||
::-webkit-scrollbar {
|
::-webkit-scrollbar {
|
||||||
width: 0.31rem; /* 设置滚动条的宽度 */
|
width: 0.31rem;
|
||||||
|
/* 设置滚动条的宽度 */
|
||||||
}
|
}
|
||||||
|
|
||||||
/* 设置滚动条的轨道样式 */
|
/* 设置滚动条的轨道样式 */
|
||||||
::-webkit-scrollbar-track {
|
::-webkit-scrollbar-track {
|
||||||
background-color: #f1f1f1; /* 设置轨道的背景色 */
|
background-color: #f1f1f1;
|
||||||
/* margin: 1.25rem 0; */
|
/* 设置轨道的背景色 */
|
||||||
|
/* margin: 1.25rem 0; */
|
||||||
}
|
}
|
||||||
|
|
||||||
/* 设置滚动条的滑块样式 */
|
/* 设置滚动条的滑块样式 */
|
||||||
::-webkit-scrollbar-thumb {
|
::-webkit-scrollbar-thumb {
|
||||||
background-color: #ccc; /* 设置滑块的背景色 */
|
background-color: #ccc;
|
||||||
border-radius: 0.31rem; /* 设置滑块的圆角 */
|
/* 设置滑块的背景色 */
|
||||||
|
border-radius: 0.31rem;
|
||||||
|
/* 设置滑块的圆角 */
|
||||||
}
|
}
|
||||||
|
|
||||||
/* 设置滚动条鼠标悬停时的滑块样式 */
|
/* 设置滚动条鼠标悬停时的滑块样式 */
|
||||||
::-webkit-scrollbar-thumb:hover {
|
::-webkit-scrollbar-thumb:hover {
|
||||||
background-color: #999; /* 设置鼠标悬停时滑块的背景色 */
|
background-color: #999;
|
||||||
|
/* 设置鼠标悬停时滑块的背景色 */
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
Loading…
Reference in New Issue