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

适配小屏

Browse Source
This commit is contained in:
gyq
2024-03-07 09:47:25 +08:00
parent b550cf3fd8
commit 396d237710
8 changed files with 73 additions and 87 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/views/home/components/cartOperation.vue
View File

@@ -122,14 +122,14 @@ function skuConfirm(e) {
<style scoped lang="scss">
.operation_wrap {
padding: 20px;
padding: var(--el-font-size-base);
display: flex;
flex-direction: column;
gap: 20px;
gap: var(--el-font-size-base);
.item {
width: 100px;
height: 40px;
width: 80px;
height: 34px;
display: flex;
align-items: center;
justify-content: center;

18
src/views/home/components/goods.vue
View File

@@ -210,7 +210,7 @@ defineExpose({
.header {
display: flex;
height: 80px;
height: 60px;
justify-content: space-between;
border-bottom: 1px solid #ececec;
}
@@ -226,7 +226,8 @@ defineExpose({
position: relative;
span {
font-size: 24px;
font-size: var(--el-font-size-base);
font-weight: bold;
}
&.active {
@@ -279,11 +280,11 @@ defineExpose({
display: flex;
justify-content: flex-end;
gap: 10px;
padding: 20px;
padding: var(--el-font-size-base);
}
.shop_list {
max-height: calc(100vh - 40px - 80px - 80px);
max-height: calc(100vh - 40px - 80px - 60px);
overflow-y: auto;
display: flex;
flex-wrap: wrap;
@@ -297,8 +298,8 @@ defineExpose({
.item_wrap {
width: 20%;
padding: 0 10px;
padding-bottom: 20px;
padding: 0 5px;
padding-bottom: 5px;
.item {
border: 1px solid #ececec;
@@ -311,7 +312,7 @@ defineExpose({
}
.dot {
padding: 0 14px;
padding: 0 8px;
background-color: var(--el-color-danger);
color: #fff;
border-radius: 20px;
@@ -320,12 +321,11 @@ defineExpose({
right: 4px;
z-index: 1;
font-size: 12px;
font-size: 18px;
}
.cover {
width: 100%;
height: 150px;
height: 80px;
}
.name {

31
src/views/home/components/settleAccount.vue
View File

@@ -66,7 +66,7 @@ import { ipcRenderer } from 'electron'
const emit = defineEmits('paySuccess')
const dialogVisible = ref(true)
const dialogVisible = ref(false)
const props = defineProps({
cart: {
type: Array,
@@ -130,7 +130,7 @@ defineExpose({
width: 100%;
height: 100%;
display: flex;
padding: 20px 0;
padding: var(--el-font-size-base) 0;
.cart_list {
flex: 1;
@@ -138,38 +138,40 @@ defineExpose({
.nav_wrap {
display: flex;
align-items: center;
padding: 0 20px;
padding: 0 var(--el-font-size-base);
.return {
width: 60px;
height: 60px;
$size: 50px;
width: $size;
height: $size;
border-radius: 50%;
border: 3px solid #333;
border: 2px solid #333;
display: flex;
align-items: center;
justify-content: center;
.icon {
color: #333;
font-size: 26px;
font-size: var(--el-font-size-base);
}
}
.info {
flex: 1;
padding-left: 20px;
padding-left: var(--el-font-size-base);
$padding: 10px;
.master_id {
font-size: calc(var(--el-font-size-base) + 10px);
border-bottom: 1px solid #ececec;
padding: 16px 0;
padding: $padding 0;
}
.btm {
display: flex;
align-items: center;
justify-content: space-between;
padding: 16px 0;
padding: $padding 0;
.p {
@@ -180,8 +182,8 @@ defineExpose({
}
.list_wrap {
padding: 20px;
height: calc(100vh - 260px);
padding: var(--el-font-size-base);
height: calc(100vh - 220px);
overflow-y: auto;
.item {
@@ -218,7 +220,7 @@ defineExpose({
padding-bottom: 10px;
.tag {
padding: 4px 10px;
padding: 2px 6px;
background-color: var(--el-color-danger);
color: #fff;
margin-right: 10px;
@@ -246,7 +248,7 @@ defineExpose({
.footer {
display: flex;
padding-top: 20px;
gap: 20px;
gap: var(--el-font-size-base);
.editor {
border: 1px solid #ececec;
@@ -255,7 +257,6 @@ defineExpose({
align-items: center;
justify-content: center;
color: #555;
font-size: 22px;
}
.button {

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

@@ -344,7 +344,7 @@ onMounted(() => {
display: flex;
align-items: center;
background-color: var(--el-color-info-light-7);
padding-left: 20px;
padding-left: var(--el-font-size-base);
.t {
font-size: $fs;
@@ -355,7 +355,7 @@ onMounted(() => {
display: flex;
align-items: center;
background-color: var(--el-color-info-light-8);
padding: 0 20px;
padding: 0 var(--el-font-size-base);
.icon {
color: var(--el-color-primary);
@@ -382,12 +382,12 @@ onMounted(() => {
.shop_list {
flex: 1;
height: calc(100vh - 40px - 60px - 130px);
height: calc(100vh - 40px - 60px - 132px);
overflow-y: auto;
border-right: 1px solid #ececec;
.item {
padding: 20px;
padding: var(--el-font-size-base);
&.active {
background-color: #f5f5f5;
@@ -400,7 +400,7 @@ onMounted(() => {
.name_wrap {
display: flex;
justify-content: space-between;
font-size: 20px;
font-size: var(--el-font-size-base);
}
.sku_list {
@@ -408,7 +408,7 @@ onMounted(() => {
padding-top: 10px;
.tag {
padding: 4px 10px;
padding: 2px 6px;
background-color: var(--el-color-danger);
color: #fff;
margin-right: 10px;
@@ -416,7 +416,7 @@ onMounted(() => {
}
.num {
padding-top: 20px;
padding-top: var(--el-font-size-base);
display: flex;
align-items: center;
justify-content: space-between;
@@ -448,7 +448,7 @@ onMounted(() => {
}
.footer {
padding: 20px;
padding: var(--el-font-size-base);
border-top: 1px solid #ececec;
.left {
@@ -465,7 +465,7 @@ onMounted(() => {
.icon {
display: block;
font-size: 20px;
font-size: var(--el-font-size-base);
color: var(--primary-color);
}
@@ -521,7 +521,7 @@ onMounted(() => {
}
.shop_manage {
flex: 2;
flex: 2.5;
margin-left: 20px;
height: 100%;
}