新增场地二维码

src/views/businessManagement/schoolOpen/index.vue

@@ -5,7 +5,7 @@
         <template #title1>
           <div class="flex">
             <TypographyTitle :level="4">开放时间</TypographyTitle>
-            <a-button type="link" @click="handleClick" v-if="getIsMerchant">查看教学日与非教学日日历</a-button>
+            <a-button type="link" @click="handleClick" v-if="getIsMerchant"> 查看教学日与非教学日日历 </a-button>
           </div>
           <Divider></Divider>
         </template>
@@ -13,6 +13,16 @@
           <TypographyTitle :level="4">封面、配套保险、使用须知</TypographyTitle>
           <Divider></Divider>
         </template>
+        <template #title3 v-if="siteId">
+          <TypographyTitle :level="4">场地二维码</TypographyTitle>
+          <Divider></Divider>
+          <div class="p-20px flex">
+            <div>
+              <QRCode :value="`https://api.qlapp.cn/useprogram/?placeId=${siteId}`" ref="qrcodeCanvasRef" />
+              <a-button type="link" block class="mt20px" @click="downloadImage">下载图片</a-button>
+            </div>
+          </div>
+        </template>
         <template #tenant="{ model, field }">
           <ApiSelect
             :api="Business"
@@ -34,8 +44,8 @@
         </template>
         <template #formFooter>
           <div style="margin: 0 auto" v-if="getIsMerchant">
-            <a-button type="primary" @click="save" class="mr-2" :loading="isSubmit"> 保存 </a-button>
-            <a-button type="error" @click="back" class="mr-2"> 关闭 </a-button>
+            <a-button type="primary" @click="save" class="mr-2" :loading="isSubmit"> 保存</a-button>
+            <a-button type="error" @click="back" class="mr-2"> 关闭</a-button>
           </div>
         </template>
       </BasicForm>
@@ -44,7 +54,7 @@
   </div>
 </template>
 <script lang="ts" setup name="business-management-schoolOpen">
-  import { TypographyTitle, Divider } from 'ant-design-vue';
+  import { TypographyTitle, Divider, QRCode } from 'ant-design-vue';
   import { BasicForm, useForm, ApiSelect } from '/@/components/Form/index';
   import ZtCustomTable from '/@/components/ZtCustomTable/index.vue';
   import { Business } from '../gymnasiumBag/gymnasiumBag.api';
@@ -54,6 +64,7 @@
   import { ref, unref } from 'vue';
   import { useRouter } from 'vue-router';
   import { storeToRefs } from 'pinia';
+
   const { userInfo, getIsMerchant } = storeToRefs(useUserStore());
   const router = useRouter();
   const [registerForm, { setProps, resetFields, setFieldsValue, updateSchema, validate, clearValidate, getFieldsValue }] = useForm({
@@ -61,6 +72,7 @@
     showActionButtonGroup: false,
   });
   const isSubmit = ref(false);
+
   function back() {
     router.back();
   }
@@ -103,17 +115,31 @@
     }
     console.log(newObj);
   }
+
+  const qrcodeCanvasRef = ref();
+  async function downloadImage() {
+    const url = await qrcodeCanvasRef.value.toDataURL();
+    const a = document.createElement('a');
+    a.download = 'competition.png';
+    a.href = url;
+    document.body.appendChild(a);
+    a.click();
+    document.body.removeChild(a);
+  }
+
   async function getData() {
     const res = await getDetails({ orgCode: useUserStore().userInfo?.orgCode });
     if (!res.teachingDay) return;
     handleCommonSet(res);
     console.log(JSON.parse(res.noTeachingDay));
   }
+
   getData();
 
   function handleClick() {
     router.push({ path: '/informationManagement/teachorNoteach' });
   }
+
   async function handleOption(options) {
     const res = await Business({ orgCode: useUserStore().userInfo?.orgCode, type: 0 });
     const orgCode = res.find((it) => it.tenantId == options).orgCode;
@@ -125,7 +151,10 @@
     }
   }
 
+  const siteId=ref()
   function handleCommonSet(res) {
+    console.log( res,'获取数据')
+    siteId.value=res.siteId
     setFieldsValue({
       ...res,
       insureIds: res.insureIds.split(','),

src/views/businessManagement/schoolOpen/schoolOpen.data.ts

@@ -3,6 +3,7 @@ import { getInsureList } from '/@/api/common/api';
 
 import { useUserStore } from '/@/store/modules/user';
 import { storeToRefs } from 'pinia';
+
 const { getIsMerchant, userInfo } = storeToRefs(useUserStore());
 export const formSchema: FormSchema[] = [
   {
@@ -130,6 +131,16 @@ export const formSchema: FormSchema[] = [
       return getIsMerchant.value ? true : model['tenantId'];
     },
   },
+  {
+    field: 'title3',
+    colSlot: 'title3',
+    label: '',
+    component: 'Input',
+    labelWidth: 0,
+    ifShow({ model }) {
+      return getIsMerchant.value ? true : model['siteId'];
+    },
+  },
 ];
 
 export const ScheduleArrangementColums: BasicColumn[] = [