befly-admin-ui 1.9.5 → 1.9.7

package/components/pageDialog.vue

@@ -1,11 +1,9 @@
 <template>
-    <TDialog v-model:visible="innerVisible" :header="props.title === '' ? true : props.title" :width="props.width" placement="center" attach="body" :close-btn="false" :footer="true" :confirm-loading="props.confirmLoading" :close-on-overlay-click="false" :close-on-esc-keydown="false" @close="onDialogClose" @confirm="onDialogConfirm" @cancel="onDialogCancel">
+    <TDialog v-model:visible="innerVisible" :header="props.title === '' ? true : props.title" :width="props.width" :dialog-class-name="props.dialogClassName" placement="center" attach="body" :close-btn="false" :footer="true" :confirm-loading="props.confirmLoading" :close-on-overlay-click="false" :close-on-esc-keydown="false" @close="onDialogClose" @confirm="onDialogConfirm" @cancel="onDialogCancel">
         <template #footer>
             <div class="dialog-footer">
                 <TButton variant="outline" @click="onFooterClose">关闭</TButton>
-                <TPopconfirm v-if="props.isConfirm" content="确定要提交吗？" :disabled="props.confirmLoading" @confirm="onFooterConfirm">
-                    <TButton theme="primary" :loading="props.confirmLoading">确定</TButton>
-                </TPopconfirm>
+                <TButton v-if="props.isConfirm" theme="primary" :loading="props.confirmLoading" @click="onFooterConfirm">确定</TButton>
             </div>
         </template>
         <div class="dialog-wrapper">
@@ -17,7 +15,7 @@
 <script setup>
 import { onBeforeUnmount, onMounted, ref, watch } from "vue";
 
-import { Button as TButton, Dialog as TDialog, Popconfirm as TPopconfirm } from "tdesign-vue-next";
+import { Button as TButton, Dialog as TDialog } from "tdesign-vue-next";
 
 defineOptions({
     inheritAttrs: false
@@ -39,6 +37,10 @@ const props = defineProps({
         type: String,
         default: "600px"
     },
+    dialogClassName: {
+        type: String,
+        default: ""
+    },
     confirmLoading: {
         type: Boolean,
         default: false
@@ -190,6 +192,7 @@ defineExpose({
     background-color: var(--bg-color-page);
     padding: var(--spacing-md);
     border-radius: var(--border-radius);
+    max-height: 80vh;
 }
 .dialog-footer {
     width: 100%;

package/layouts/default.vue

@@ -83,10 +83,11 @@ import { reactive, watch } from "vue";
 import { useRoute, useRouter } from "vue-router";
 import { $Http } from "@/plugins/http.js";
 import { $Config } from "@/plugins/config.js";
+import { $Store } from "@/plugins/store.js";
 
 const router = useRouter();
 const route = useRoute();
-const uploadHeaders = { Authorization: `Bearer ${localStorage.getItem($Config.tokenName) || ""}` };
+const uploadHeaders = { Authorization: `Bearer ${$Store.local.get($Config.tokenName, "")}` };
 
 function isString(value) {
     return typeof value === "string";
@@ -243,7 +244,7 @@ async function handleLogout() {
             }
 
             try {
-                localStorage.removeItem($Config.tokenName);
+                $Store.local.remove($Config.tokenName);
                 await router.push($Config.loginPath);
                 MessagePlugin.success("退出成功");
                 destroy();

package/package.json

@@ -1,7 +1,7 @@
 {
     "name": "befly-admin-ui",
-    "version": "1.9.5",
-    "gitHead": "3c088ebee92793df7641217a4566cca7875134f2",
+    "version": "1.9.7",
+    "gitHead": "913ad3b34f63ddf0936fb338fadc78ade7edf00d",
     "private": false,
     "description": "Befly - 管理后台功能组件",
     "keywords": [

package/views/login_1/index.vue

@@ -70,6 +70,7 @@ import { LockOnIcon, UserIcon } from "tdesign-icons-vue-next";
 import { hashPassword } from "befly-admin-ui/utils/hashPassword";
 import { $Http } from "@/plugins/http.js";
 import { $Config } from "@/plugins/config.js";
+import { $Store } from "@/plugins/store.js";
 
 const router = useRouter();
 
@@ -109,7 +110,7 @@ async function apiLogin() {
             password: hashedPassword
         });
 
-        localStorage.setItem($Config.tokenName, res.data.token);
+        $Store.local.set($Config.tokenName, res.data.token);
 
         MessagePlugin.success(res.msg || "登录成功");
 

package/views/people/admin/components/edit.vue

@@ -1,23 +1,22 @@
 <template>
-    <PageDialog v-model="dialogVisible" :title="$Prop.actionType === 'upd' ? '编辑管理员' : '添加管理员'" :confirm-loading="$Data.submitting" @confirm="onSubmit">
+    <PageDialog v-model="$Computed.dialogVisible" :title="$Computed.dialogTitle" :confirm-loading="$Data.submitting" @confirm="$Method.onSubmit">
         <div class="dialog-wrapper">
-            <TForm :model="$Data.formData" label-width="80px" label-position="left" label-align="left" :rules="$Data2.formRules" ref="formRef">
+            <TForm :model="$Data.formData" label-width="80px" label-position="left" label-align="left" :rules="$Const.formRules" :ref="(el) => ($From.formRef = el)">
                 <TFormItem label="角色" prop="roleCode">
-                    <TSelect v-model="$Data.formData.roleCode" :options="$Data.allRoleLists" :keys="$Data.keys" placeholder="请选择角色" />
+                    <TSelect v-model="$Data.formData.roleCode" :options="$Type.roleOptions" placeholder="请选择角色" />
                 </TFormItem>
                 <TFormItem label="用户名" prop="username">
-                    <TInput v-model="$Data.formData.username" placeholder="请输入用户名" :disabled="$Prop.actionType === 'upd'" />
+                    <TInput v-model="$Data.formData.username" placeholder="请输入用户名" :disabled="$Computed.isUpdate" />
                 </TFormItem>
-                <TFormItem v-if="$Prop.actionType === 'add'" label="密码" prop="password">
+                <TFormItem v-if="$Computed.isAdd" label="密码" prop="password">
                     <TInput v-model="$Data.formData.password" type="password" placeholder="请输入密码，至少6位" />
                 </TFormItem>
                 <TFormItem label="昵称" prop="nickname">
                     <TInput v-model="$Data.formData.nickname" placeholder="请输入昵称" />
                 </TFormItem>
-                <TFormItem v-if="$Prop.actionType === 'upd'" label="状态" prop="state">
+                <TFormItem v-if="$Computed.isUpdate" label="状态" prop="state">
                     <TRadioGroup v-model="$Data.formData.state">
-                        <TRadio :label="1">正常</TRadio>
-                        <TRadio :label="2">禁用</TRadio>
+                        <TRadio v-for="item in $Type.stateOptions" :key="item.value" :value="item.value">{{ item.label }}</TRadio>
                     </TRadioGroup>
                 </TFormItem>
             </TForm>
@@ -26,7 +25,7 @@
 </template>
 
 <script setup>
-import { computed, reactive, ref } from "vue";
+import { computed, reactive } from "vue";
 
 import {
     //
@@ -54,40 +53,27 @@ const $Prop = defineProps({
     },
     rowData: {
         type: Object,
-        default: {}
+        default: () => ({})
     }
 });
 
 const $Emit = defineEmits(["update:modelValue", "success"]);
 
-// 表单引用
-const formRef = ref(null);
-
-const dialogVisible = computed({
-    get: () => $Prop.modelValue,
-    set: (value) => {
-        $Emit("update:modelValue", value);
-    }
-});
-
-const $Data = reactive({
-    submitting: false,
-    allRoleLists: [],
-    keys: {
-        label: "name",
-        value: "code"
+const $Const = {
+    actionTitleMap: {
+        add: "添加管理员",
+        upd: "编辑管理员"
+    },
+    createDefaultFormData() {
+        return {
+            id: null,
+            username: "",
+            password: "",
+            nickname: "",
+            roleCode: "",
+            state: 1
+        };
     },
-    formData: {
-        id: null,
-        username: "",
-        password: "",
-        nickname: "",
-        roleCode: null,
-        state: 1
-    }
-});
-
-const $Data2 = reactive({
     formRules: {
         username: [{ required: true, message: "请输入用户名", trigger: "blur" }],
         password: [
@@ -97,60 +83,111 @@ const $Data2 = reactive({
         roleCode: [{ required: true, message: "请选择角色", trigger: "change" }],
         nickname: [{ min: 2, max: 50, message: "昵称长度在 2 到 50 个字符", trigger: "blur" }]
     }
+};
+
+const $Type = reactive({
+    roleOptions: [],
+    stateOptions: [
+        { label: "正常", value: 1 },
+        { label: "禁用", value: 2 }
+    ]
 });
 
-async function initData() {
-    await apiRoleLists();
-    if ($Prop.actionType === "upd" && $Prop.rowData.id) {
-        $Data.formData = Object.assign({}, $Prop.rowData);
-    }
-}
-
-async function apiRoleLists() {
-    try {
-        const result = await $Http("/core/role/all", {}, [""]);
-        $Data.allRoleLists = result.data || [];
-    } catch (error) {
-        MessagePlugin.error(error.msg || error.message || "加载角色列表失败");
-    }
-}
-
-async function onSubmit(context) {
-    try {
-        const form = formRef.value;
-        if (!form) {
-            MessagePlugin.warning("表单未就绪");
-            return;
+const $Computed = reactive({
+    isAdd: computed(() => $Prop.actionType === "add"),
+    isUpdate: computed(() => $Prop.actionType === "upd"),
+    dialogVisible: computed({
+        get: () => $Prop.modelValue,
+        set: (value) => {
+            $Emit("update:modelValue", value);
         }
+    }),
+    dialogTitle: computed(() => $Const.actionTitleMap[$Prop.actionType] || "添加管理员")
+});
 
-        const valid = await form.validate();
-        if (!valid) return;
+const $From = {
+    formRef: null
+};
 
-        $Data.submitting = true;
-        const formData = $Prop.actionType === "add" ? fieldClear($Data.formData, { omitKeys: ["id", "state"] }) : fieldClear($Data.formData, { omitKeys: ["password"] });
+const $Data = reactive({
+    submitting: false,
+    formData: $Const.createDefaultFormData()
+});
 
-        const password = typeof formData["password"] === "string" ? String(formData["password"]) : "";
-        if ($Prop.actionType === "add" && password) {
-            formData["password"] = await hashPassword(password);
+const $Method = {
+    resetFormData() {
+        Object.assign($Data.formData, $Const.createDefaultFormData());
+    },
+    assignFormData(rowData) {
+        Object.assign($Data.formData, $Const.createDefaultFormData(), {
+            id: rowData.id ?? null,
+            username: rowData.username || "",
+            nickname: rowData.nickname || "",
+            roleCode: rowData.roleCode || "",
+            state: typeof rowData.state === "number" ? rowData.state : 1
+        });
+    },
+    async apiRoleLists() {
+        try {
+            const result = await $Http("/core/role/all", {}, [""]);
+            const roleList = Array.isArray(result.data?.lists) ? result.data.lists : [];
+            $Type.roleOptions = roleList.map((item) => {
+                return {
+                    label: item.name || item.code || "",
+                    value: item.code || ""
+                };
+            });
+        } catch (error) {
+            MessagePlugin.error(error.msg || error.message || "加载角色列表失败");
+        }
+    },
+    buildSubmitData() {
+        return $Computed.isAdd ? fieldClear($Data.formData, { omitKeys: ["id", "state"] }) : fieldClear($Data.formData, { omitKeys: ["password"] });
+    },
+    async initData() {
+        await $Method.apiRoleLists();
+        if ($Computed.isUpdate && $Prop.rowData.id) {
+            $Method.assignFormData($Prop.rowData);
+            return;
         }
 
-        const result = await $Http($Prop.actionType === "upd" ? "/core/admin/upd" : "/core/admin/ins", formData);
-
-        MessagePlugin.success(result.msg);
-        $Emit("success");
-        if (context && typeof context.close === "function") {
-            context.close();
+        $Method.resetFormData();
+    },
+    async onSubmit(context) {
+        try {
+            const form = $From.formRef;
+            if (!form) {
+                MessagePlugin.warning("表单未就绪");
+                return;
+            }
+
+            const valid = await form.validate();
+            if (!valid) return;
+
+            $Data.submitting = true;
+            const formData = $Method.buildSubmitData();
+
+            const password = typeof formData.password === "string" ? String(formData.password) : "";
+            if ($Computed.isAdd && password) {
+                formData.password = await hashPassword(password);
+            }
+
+            const result = await $Http($Computed.isUpdate ? "/core/admin/upd" : "/core/admin/ins", formData);
+
+            MessagePlugin.success(result.msg);
+            $Emit("success");
+            if (context && typeof context.close === "function") {
+                context.close();
+            }
+        } catch (error) {
+            MessagePlugin.error(error.msg || error.message || "提交失败");
+        } finally {
+            $Data.submitting = false;
         }
-    } catch (error) {
-        MessagePlugin.error(error.msg || error.message || "提交失败");
-    } finally {
-        $Data.submitting = false;
     }
-}
+};
 
-initData();
+$Method.initData();
 </script>
 
-<style scoped lang="scss">
-// 可根据需要添加样式
-</style>
+<style scoped lang="scss"></style>

package/views/resource/gallery/index.vue

@@ -91,9 +91,10 @@ import DetailPanel from "befly-admin-ui/components/detailPanel.vue";
 import PageTableDetail from "befly-admin-ui/components/pageTableDetail.vue";
 import { withDefaultColumns } from "befly-admin-ui/utils/withDefaultColumns";
 import { $Config } from "@/plugins/config.js";
+import { $Store } from "@/plugins/store.js";
 
 const uploadHeaders = {
-    Authorization: `Bearer ${localStorage.getItem($Config.tokenName) || ""}`
+    Authorization: `Bearer ${$Store.local.get($Config.tokenName, "")}`
 };
 
 const $Data = reactive({