商户首页排版

merchant-ui/src/views/welcome/index.vue

@@ -4,6 +4,7 @@ import * as $api from "@/api/auth/index";
 import * as $merchantApi from "@/api/merchant/index";
 import {onMounted, reactive, ref} from "vue";
 import Bind from "@/views/welcome/bind.vue";
+
 const bindRef = ref();
 defineOptions({
   name: "Welcome"
@@ -13,14 +14,13 @@ onMounted(() => {
   merchantKey();
   $api.hasGoogleOtp().then((res: any) => {
     if (!res.result) {
-      bindRef.value!.open({}, {}, "add");
-
+      bindRef.value!.open();
     }
   });
 });
 const merchantKey = () => {
   $merchantApi.info().then((res: any) => {
-    pageData.formData = res.result
+    pageData.formData = res.result;
   });
 };
 const pageData: any = reactive({
@@ -32,21 +32,23 @@ const pageData: any = reactive({
 </script>
 
 <template>
-  <div class="max-w-full">
-    <el-card style="width: 480px; border-radius: 8px" shadow="hover">
-      <template #default v-if="merchantKeyInfo">
-        <el-form :model="pageData.formData">
-          <el-form-item label="appId:">
-            <el-input v-model="pageData.formData.appId" />
-          </el-form-item>
-          <el-form-item label="appKey:">
-            <el-input v-model="pageData.formData.appKey" />
-          </el-form-item>
-        </el-form>
-      </template>
-    </el-card>
+  <div>
+    <div class="max-w-full">
+      <el-card style="width: 480px; border-radius: 8px" shadow="hover">
+        <template #default v-if="merchantKeyInfo">
+          <el-form :model="pageData.formData">
+            <el-form-item label="appId:">
+              <span>{{ pageData.formData.appId }}</span>
+            </el-form-item>
+            <el-form-item label="appKey:">
+              <span>{{ pageData.formData.appKey }}</span>
+            </el-form-item>
+          </el-form>
+        </template>
+      </el-card>
+    </div>
+    <bind ref="bindRef" />
   </div>
-  <bind ref="bindRef"></bind>
 </template>
 
 <style scoped>