From 969725647117eb7ca148b2e8cfa9ec8b5eb432fa Mon Sep 17 00:00:00 2001
From: Ben Lin <maobin001@msn.com>
Date: 星期二, 22 十月 2024 11:04:10 +0800
Subject: [PATCH] 工艺缓存优化
---
src/views/tigerprojects/wms/createqrcode/index.vue | 70 ++++++++++++++++++++++++++--------
1 files changed, 53 insertions(+), 17 deletions(-)
diff --git a/src/views/tigerprojects/wms/createqrcode/index.vue b/src/views/tigerprojects/wms/createqrcode/index.vue
index fe49488..c074b91 100644
--- a/src/views/tigerprojects/wms/createqrcode/index.vue
+++ b/src/views/tigerprojects/wms/createqrcode/index.vue
@@ -1,21 +1,22 @@
+/* stylelint-disable rule-empty-line-before */
<template>
<PageWrapper title="鐢熸垚浜岀淮鐮�" contentFullHeight contentClass="flex">
<template #headerContent>
<BasicForm @register="register">
<template #search="{ field }">
- <Button v-if="field" style="margin-left: 0" @click="onSearch">鐢熸垚</Button>
+ <Button v-if="field" style="margin-left: 10" @click="onSearch">鐢熸垚</Button>
</template>
</BasicForm>
</template>
- <div class="w-1/4 xl:w-1/5 p-3" style="background-color: white">
- <a-list size="small" bordered :data-source="hisData">
+ <div class="w-2/4 xl:w-2/6 p-3" style="background-color: white">
+ <a-list size="large" bordered :pagination="pagination" :data-source="hisData">
<template #renderItem="{ item }">
<a-list-item>
- <a-list-item-meta description="">
- <template #title>
- <span @click="showQr(item)">{{ item }}</span>
- </template>
- </a-list-item-meta>
+ <template #actions>
+ <a key="list-loadmore-edit" @click="del(item.key)">鍒犻櫎</a>
+ </template>
+ <span @click="showQr(item.data)">{{ item.data }}</span>
+ <!-- {{ item }} -->
</a-list-item>
</template>
<template #header>
@@ -26,7 +27,7 @@
</template> -->
</a-list>
</div>
- <div class="w-3/4 xl:w-4/5 p-5" v-if="show">
+ <div class="w-2/4 xl:w-4/6 p-5" v-if="show">
<!-- <CollapseContainer title="浜岀淮鐮�" class="text-center qrcode-demo-item"></CollapseContainer> -->
<div class="mb-4 pt-4 text-center" style="width: 99%; background-color: white">
<QrCode
@@ -39,24 +40,23 @@
@done="onQrcodeDone"
/>
<!-- <a-button class="mb-2" type="primary" @click="downloadDiy"> 涓嬭浇 </a-button> -->
- <!-- <div class="msg">瑕佽繘琛屾墿灞曠粯鍒跺垯涓嶈兘灏唗ag璁句负img</div> -->
+ <span class="mb-5 p-5" style="color: #0780b9">{{ qrCodeUrl }}</span>
</div>
</div>
</PageWrapper>
</template>
<script lang="ts" setup>
- import { onMounted, ref } from 'vue';
+ import { ref } from 'vue';
import { List, ListItem, ListItemMeta } from 'ant-design-vue';
import { QrCode } from '/@/components/Qrcode/index';
import LogoImg from '/@/assets/images/logo.png';
- import { CollapseContainer } from '/@/components/Container/index';
- import { GetQrCode } from '/@/api/tigerapi/wms/qrcode';
import { useMessage } from '/@/hooks/web/useMessage';
import { PageWrapper } from '/@/components/Page';
import { BasicForm, FormSchema, useForm } from '/@/components/Form/index';
import { Button } from '/@/components/Button';
import { useQrhisStore } from '/@/store/modules/qrhis';
import { storeToRefs } from 'pinia';
+ import { buildUUID } from '/@/utils/uuid';
const AList = List;
const AListItem = ListItem;
@@ -80,12 +80,13 @@
},
];
- let qrDatas:any[] = []
+ let qrDatas: any[] = [];
const useQrhis = useQrhisStore();
const { hisData } = storeToRefs(useQrhis);
const { createMessage } = useMessage();
const show = ref(false);
const qrCodeUrl = ref('');
+ const qrCodeKey = ref('');
const [register, { validateFields, clearValidate, getFieldsValue, resetFields, setFieldsValue }] =
useForm({
showSubmitButton: false,
@@ -105,7 +106,7 @@
ctx.font = '16px "寰蒋闆呴粦"';
ctx.textBaseline = 'bottom';
ctx.textAlign = 'center';
- ctx.fillText('浣犲竻浣犲厛鎵�', 200, 380, 200);
+ ctx.fillText('浣犲竻浣犲厛鎵�', 200, 380, 600);
}
}
async function onSearch({ ctx }: any) {
@@ -113,8 +114,9 @@
if (barcode.SN != '') {
show.value = true;
qrCodeUrl.value = barcode.SN;
- useQrhis.gethisData.push(barcode.SN);
- qrDatas = useQrhis.gethisData
+ qrCodeKey.value = buildUUID();
+ useQrhis.gethisData.push({ key: qrCodeKey.value, data: qrCodeUrl.value });
+ qrDatas = useQrhis.gethisData;
useQrhis.sethisData(qrDatas);
// var apiAction = await GetQrCode(barcode.SN)
// if(apiAction.IsSuccessed){
@@ -127,11 +129,18 @@
// qrCodeUrl.value=barcode.SN;
// //createMessage.error('鏉＄爜绯荤粺涓嶅瓨鍦�');
// }
+ resetFields();
} else {
show.value = false;
createMessage.error('杈撳叆鐨勬潯鐮佷负绌�');
}
}
+
+ /**
+ * @description: 鏄剧ず浜岀淮鐮�
+ * @param {*} code
+ * @return {*}
+ */
async function showQr(code: string) {
if (code != '') {
show.value = true;
@@ -141,10 +150,37 @@
createMessage.error('杈撳叆鐨勬潯鐮佷负绌�');
}
}
+
+ /**
+ * @description: 鍒犻櫎
+ * @param {*} code
+ * @return {*}
+ */
+ function del(code) {
+ useQrhis.hisData = useQrhis.gethisData.filter((item) => item.key !== code);
+ qrDatas = useQrhis.gethisData;
+ useQrhis.sethisData(qrDatas);
+ }
+
+ const pagination = {
+ onChange: (page: number) => {
+ console.log(page);
+ },
+ pageSize: 10,
+ };
</script>
<style scoped>
.qrcode-demo-item {
width: 100%;
margin-right: 1%;
}
+
+ span {
+ display: block;
+ width: auto;
+ overflow: hidden;
+ word-wrap: break-word;
+ word-break: normal;
+ white-space: pre-wrap;
+ }
</style>
--
Gitblit v1.9.3