11

src/views/oem/OemOverviewView.vue

@@ -1,14 +1,142 @@
 <script setup>
-import { useAuthStore } from "../../stores/auth";
+import { onMounted, ref } from "vue";
+import { useAuthStore } from "../../stores/auth.js";
+import AdminImageUpload from "../../components/admin/AdminImageUpload.vue";
+import {
+  loadAdminAppBrandingApi,
+  saveAdminAppBrandingApi,
+} from "../../api/adminAppBranding.js";
 
 const auth = useAuthStore();
+
+const form = ref({
+  softwareName: "",
+  logo: "",
+  contactWechat: "",
+  contactQq: "",
+  wechatQr: "",
+  qqQr: "",
+});
+
+const loading = ref(false);
+const saving = ref(false);
+const feedback = ref({ severity: "", message: "" });
+
+function showMessage(severity, message) {
+  feedback.value = { severity, message };
+}
+
+function onImageError(message) {
+  showMessage("warn", message);
+}
+
+async function loadSettings() {
+  loading.value = true;
+  feedback.value = { severity: "", message: "" };
+  const res = await loadAdminAppBrandingApi(auth.token);
+  loading.value = false;
+
+  if (!res.ok) {
+    showMessage("error", res.message || "加载失败");
+    return;
+  }
+
+  form.value = { ...res.data.form };
+}
+
+async function saveSettings() {
+  saving.value = true;
+  feedback.value = { severity: "", message: "" };
+  const res = await saveAdminAppBrandingApi(auth.token, form.value);
+  saving.value = false;
+
+  if (!res.ok) {
+    showMessage("error", res.message || "保存失败");
+    return;
+  }
+
+  showMessage("success", res.message || "已保存");
+  await loadSettings();
+}
+
+onMounted(() => {
+  loadSettings();
+});
 </script>
 
 <template>
-  <div class="admin-page">
-    <h1 class="admin-page__title gradient-text">软件配置</h1>
-    <p class="text-sm text-text-muted">
-      欢迎，{{ auth.currentUser?.username }}
-    </p>
+  <div class="admin-page admin-overview">
+    <div class="admin-users__header">
+      <div>
+        <h1 class="admin-page__title gradient-text">软件配置</h1>
+        <p class="text-sm text-text-muted">
+          欢迎，{{ auth.currentUser?.username }}
+        </p>
+      </div>
+      <Button label="保存配置" :loading="saving" :disabled="loading" @click="saveSettings" />
+    </div>
+
+    <Message
+      v-if="feedback.message"
+      :severity="feedback.severity"
+      :closable="true"
+      class="admin-users__message"
+      @close="feedback.message = ''"
+    >
+      {{ feedback.message }}
+    </Message>
+
+    <div v-if="loading" class="py-12 text-center text-sm text-text-muted">加载中…</div>
+
+    <form
+      v-else
+      class="admin-overview__form"
+      @submit.prevent="saveSettings"
+    >
+      <div class="admin-overview__field">
+        <label class="admin-overview__label">软件名称</label>
+        <InputText
+          v-model="form.softwareName"
+          class="admin-overview__input"
+          placeholder="请输入软件名称"
+        />
+      </div>
+
+      <AdminImageUpload
+        v-model="form.logo"
+        label="软件 logo"
+        @error="onImageError"
+      />
+
+      <div class="admin-overview__field">
+        <label class="admin-overview__label">联系微信</label>
+        <InputText
+          v-model="form.contactWechat"
+          class="admin-overview__input"
+          placeholder="微信号或联系方式"
+        />
+      </div>
+
+      <div class="admin-overview__field">
+        <label class="admin-overview__label">联系 QQ</label>
+        <InputText
+          v-model="form.contactQq"
+          class="admin-overview__input"
+          placeholder="QQ 号或联系方式"
+        />
+      </div>
+
+      <AdminImageUpload
+        v-model="form.wechatQr"
+        label="微信二维码"
+        @error="onImageError"
+      />
+
+      <AdminImageUpload
+        v-model="form.qqQr"
+        label="QQ 二维码"
+        @error="onImageError"
+      />
+    </form>
   </div>
 </template>