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

优化

Browse Source
This commit is contained in:
gyq
2024-03-11 14:34:17 +08:00
parent 11290d1505
commit 0fbc614c61
13 changed files with 156 additions and 217 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
src/App.vue
View File

@@ -5,28 +5,36 @@
<left-menu />
</div>
<div :class="{ view: route.path != '/login' }">
<router-view />
<!-- <div class="wrapper">
<div class="wrapper">
<div class="animation">
<router-view v-slot="{ Component }">
<transition :name="transitionName">
<!-- <transition :name="transitionName"> -->
<keep-alive :include="includeList">
<component :is="Component"></component>
</transition>
</keep-alive>
<!-- </transition> -->
</router-view>
</div>
</div> -->
</div>
</div>
</div>
</el-config-provider>
</template>
<script setup>
import { ref } from "vue";
import { ref, reactive, watch } from "vue";
import { useRouter, useRoute } from "vue-router"
import leftMenu from '@/components/leftMenu.vue'
const route = useRoute()
const includeList = reactive([]);
watch(route, (to) => {
if (to.meta.keepAlive) {
includeList.push(to.name);
}
});
let transitionName = ref();
let router = useRouter();
router.beforeEach((to, from) => {

77
src/components/skuModal.vue
View File

@@ -1,14 +1,14 @@
<template>
<el-dialog :title="goods.name" width="500" v-model="dialogVisible">
<el-dialog :title="goods.name" width="600" v-model="dialogVisible">
<div class="header">选择规格</div>
<div v-loading="loading">
<div class="row" v-for="(item, index) in goods.tbProductSpec.specList" :key="index">
<div class="row" v-for="(item, index) in goods.selectSpec" :key="index">
<div class="title">{{ item.name }}</div>
<div class="sku_wrap">
<!-- <div class="item" :class="{ active: val.active }" v-for="(val, i) in item.value" :key="i"
@click="selectedSku(index, i)">{{ val.name }}</div> -->
<el-button :plain="!val.active" type="primary" v-for="(val, i) in item.value" :key="i"
@click="selectedSku(index, i)">{{ val.name }}</el-button>
<el-button :plain="!val.active" type="primary" v-for="(val, i) in item.selectSpecResult
" :key="i" @click="selectedSku(index, i)" class="btn">{{ val.name }}</el-button>
</div>
</div>
</div>
@@ -68,14 +68,14 @@ function submitSku() {
// 选择规格
function selectedSku(index, i) {
goods.value.tbProductSpec.specList[index].value.map(item => {
goods.value.selectSpec[index].selectSpecResult.map(item => {
item.active = false
})
if (goods.value.tbProductSpec.specList[index].value[i].active) {
goods.value.tbProductSpec.specList[index].value[i].active = false
if (goods.value.selectSpec[index].selectSpecResult[i].active) {
goods.value.selectSpec[index].selectSpecResult[i].active = false
selectedSkuNum.value--
} else {
goods.value.tbProductSpec.specList[index].value[i].active = true
goods.value.selectSpec[index].selectSpecResult[i].active = true
selectedSkuNum.value++
}
selectedSuccess()
@@ -85,8 +85,8 @@ function selectedSku(index, i) {
function selectedSuccess() {
let num = 0
let tag = []
goods.value.tbProductSpec.specList.map(item => {
item.value.map(val => {
goods.value.selectSpec.map(item => {
item.selectSpecResult.map(val => {
if (val.active) {
num++
tag.push(val.name)
@@ -96,7 +96,7 @@ function selectedSuccess() {
selectedSkuTag.value = tag.join(',')
})
if (selectedSkuNum.value >= goods.value.tbProductSpec.specList.length) {
if (selectedSkuNum.value >= goods.value.selectSpec.length) {
// 规格选完了
queryProductSkuAjax()
}
@@ -133,34 +133,33 @@ function show(item, t = 'shop') {
goods.value = ""
goods.value = item
type.value = t
if (typeof goods.value.tbProductSpec.specList == 'string') {
goods.value.tbProductSpec.specList = JSON.parse(goods.value.tbProductSpec.specList)
goods.value.tbProductSpec.specList.map(item => {
let arr = []
item.value.map(val => {
switch (type.value) {
case 'shop':
arr.push({
active: false,
name: val
})
break;
case 'cart':
// 如果从购物车选择规格需要做选中效果
const skus = goods.value.skuName.split(',')
arr.push({
active: !!skus.find(item => item === val),
name: val
})
break;
goods.value.selectSpec = JSON.parse(goods.value.selectSpec)
goods.value.selectSpec.map(item => {
let arr = []
item.selectSpecResult.map(val => {
switch (type.value) {
case 'shop':
arr.push({
active: false,
name: val
})
break;
case 'cart':
// 如果从购物车选择规格需要做选中效果
const skus = goods.value.skuName.split(',')
arr.push({
active: !!skus.find(item => item === val),
name: val
})
break;
default:
break;
}
})
item.value = arr
default:
break;
}
})
}
item.selectSpecResult = arr
})
console.log(goods.value)
selectedSuccess()
}
@@ -185,7 +184,9 @@ defineExpose({
.sku_wrap {
display: flex;
padding: 14px 0;
padding: var(--el-font-size-base) 0;
flex-wrap: wrap;
gap: var(--el-font-size-base);
}
}

3
src/router/index.js
View File

@@ -6,6 +6,9 @@ const routes = [
{
path: "/",
name: "home",
meta: {
keepAlive: true
},
component: home,
},
{

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

@@ -125,11 +125,11 @@ function skuConfirm(e) {
padding: 10px;
display: flex;
flex-direction: column;
gap: 14px;
gap: 16px;
.item {
width: 70px;
height: 30px;
height: 34px;
display: flex;
align-items: center;
justify-content: center;

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

@@ -39,8 +39,7 @@
<div class="item">
<div class="dot" v-if="item.orderCount">{{ item.orderCount }}</div>
<div class="cover" v-if="shopListType == 'img'">
<el-image :src="item.coverImg" style="width: 100%;height: 100%;background-color: #efefef;"
fit="contain"></el-image>
<el-image :src="item.coverImg" class="el_img" fit="cover"></el-image>
</div>
<div class="name"><el-text line-clamp="2">{{ item.name }}</el-text></div>
<div class="item_empty" v-if="shopListType == 'text'"></div>
@@ -330,7 +329,17 @@ defineExpose({
.cover {
width: 100%;
height: 80px;
padding-bottom: 100%;
position: relative;
.el_img {
width: 100%;
height: 100%;
background-color: #efefef;
position: absolute;
top: 0;
left: 0;
}
}
.name {

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

@@ -104,6 +104,11 @@
<pendingCartModal ref="pendingCartModalRef" @select="pendingCartHandle" />
</template>
<script>
export default {
name: 'home'
}
</script>
<script setup>
import { onMounted, ref } from 'vue'
import { useUser } from "@/store/user.js"

37
src/views/home/test.vue
View File

@@ -1,37 +1,20 @@
<template>
<el-button @click="chooseSerial">选择扫码枪串口</el-button>
<el-input ref="inputRef" v-model="printValue" @keyup.enter="enterHandle" @input="inputHandle"></el-input>
<el-button @click="chooseSerial">打印</el-button>
</template>
<script setup>
import _ from 'lodash'
import { ref, onMounted } from 'vue';
const inputRef = ref(null)
const printValue = ref('')
function enterHandle() {
console.log('回车了')
}
const inputHandle = _.debounce(function (e) {
console.log('扫码枪输入完了', e)
}, 100)
import { ipcRenderer } from 'electron'
//选择串口设备
const chooseSerial = async () => {
if ('serial' in navigator) {
// await port.close();
console.log('当前浏览器支持serial')
const port = await navigator.serial.requestPort()
await port.open({ baudRate: 9600 })
let printNum = localStorage.getItem('printNum')
if (!printNum) {
printNum = 1
localStorage.setItem('printNum', printNum)
} else {
printNum++
localStorage.setItem('printNum', printNum)
}
ipcRenderer.send('printStart', printNum)
};
onMounted(() => {
setTimeout(() => {
inputRef.value.focus()
}, 1000)
})
</script>

6
src/views/login.vue
View File

@@ -72,9 +72,9 @@ const loading = ref(false);
const form = reactive({
serialNumber: RandomNumBoth(1000, 9999),
clientType: 'pc',
merchantName: '18821670757',
loginName: "18821670757",
password: "123456",
merchantName: '',
loginName: "",
password: "",
});
const rules = reactive({