Ben Lin
2024-10-10 cf2389121671bc8d09f32175acae80b074e21fc3
src/views/tigerprojects/wms/createqrcode/index.vue
@@ -1,17 +1,34 @@
<template>
  <PageWrapper title="生成二维码">
    <div class="mb-4 pt-4" style="background-color: white; width: 99%;">
  <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: 0" @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">
        <template #renderItem="{ item }">
          <a-list-item>
            <a-list-item-meta description="">
              <template #title>
                <span @click="showQr(item)">{{ item }}</span>
              </template>
            </a-list-item-meta>
          </a-list-item>
        </template>
        <template #header>
          <div>历史记录</div>
        </template>
        <!-- <template #footer>
          <div>Footer</div>
        </template> -->
      </a-list>
    </div>
    <div class="flex flex-wrap" v-if="show">
    <div class="w-3/4 xl:w-4/5 p-5" v-if="show">
      <!-- <CollapseContainer title="二维码" class="text-center qrcode-demo-item"></CollapseContainer> -->
      <div class="mb-4 pt-4 text-center" style="background-color: white; width: 99%;">
      <div class="mb-4 pt-4 text-center" style="width: 99%; background-color: white">
        <QrCode
          :value="qrCodeUrl"
          :width="390"
@@ -28,7 +45,8 @@
  </PageWrapper>
</template>
<script lang="ts"  setup>
import { ref } from 'vue';
  import { onMounted, 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';
@@ -37,7 +55,12 @@
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';
  const AList = List;
  const AListItem = ListItem;
  const AListItemMeta = ListItemMeta;
const schemas: FormSchema[] = [
  {
    field: 'SN',
@@ -46,24 +69,25 @@
      colProps: {
        span: 8,
      },
  },{
    },
    {
        field: '0',
        component: 'Input',
        slot: 'search',
        colProps: {
          span: 4,
        },
      }
    },
];
  let qrDatas:any[] = []
  const useQrhis = useQrhisStore();
  const { hisData } = storeToRefs(useQrhis);
const { createMessage } = useMessage();
const show = ref(false)
  const show = ref(false);
const qrCodeUrl = ref('');
const [
      register,
      { validateFields, clearValidate, getFieldsValue, resetFields, setFieldsValue },
    ] = useForm({
  const [register, { validateFields, clearValidate, getFieldsValue, resetFields, setFieldsValue }] =
    useForm({
      showSubmitButton: false,
      showResetButton: false,
      labelWidth: 80,
@@ -89,6 +113,9 @@
 if(barcode.SN!=''){
  show.value=true;
  qrCodeUrl.value=barcode.SN;
      useQrhis.gethisData.push(barcode.SN);
      qrDatas = useQrhis.gethisData
      useQrhis.sethisData(qrDatas);
  // var apiAction = await GetQrCode(barcode.SN)
  // if(apiAction.IsSuccessed){
  //   show.value=true;
@@ -104,7 +131,15 @@
  show.value=false;
  createMessage.error('输入的条码为空');
 }
  }
  async function showQr(code: string) {
    if (code != '') {
      show.value = true;
      qrCodeUrl.value = code;
    } else {
      show.value = false;
      createMessage.error('输入的条码为空');
    }
}
</script>
<style scoped>