From ef3906e9669cc75c054ef9bf4ea6336b727a539b Mon Sep 17 00:00:00 2001
From: zhangwei <1504152376@qq.com>
Date: 星期一, 21 七月 2025 16:38:35 +0800
Subject: [PATCH] '个人中心页面布局'
---
src/views/register/registernav.vue | 11 ++
src/views/mine/index.vue | 187 ++++++++++++++++++++++++++++++++++++++++++++++
src/router/modules/mine.ts | 6
src/api/mine.ts | 23 +++++
src/layout/hooks/useNav.ts | 10 ++
5 files changed, 230 insertions(+), 7 deletions(-)
diff --git a/src/api/mine.ts b/src/api/mine.ts
new file mode 100644
index 0000000..84ee178
--- /dev/null
+++ b/src/api/mine.ts
@@ -0,0 +1,23 @@
+/**
+ * 锛堜笉寤鸿鍐欐垚 request.post(xxx)锛屽洜涓鸿繖鏍� post 鏃讹紝鏃犳硶 params 涓� data 鍚屾椂浼犲弬锛�
+ *
+ * 涓汉涓績api鎺ュ彛闆嗗悎
+ * @method login 鐧诲綍
+ */
+
+import { http } from "@/utils/http";
+import { baseUrlApi } from "./util";
+type Result = {
+ success: boolean;
+ data: Array<any>;
+};
+
+// 鑾峰彇涓汉涓績鏁版嵁
+export const cusExtendInfo = (data?: object) => {
+ return http.request("post", baseUrlApi("/api/customer/cusExtendInfo"), { data });
+};
+
+// 淇敼涓汉涓績鏁版嵁
+export const changeCusExtend = (data?: object) => {
+ return http.request("post", baseUrlApi("/api/customer/changeCusExtend"), { data });
+};
diff --git a/src/layout/hooks/useNav.ts b/src/layout/hooks/useNav.ts
index 2448efb..2da245e 100644
--- a/src/layout/hooks/useNav.ts
+++ b/src/layout/hooks/useNav.ts
@@ -51,6 +51,15 @@
: useUserStoreHook()?.nickname;
});
+ /** 瑙掕壊 */
+ const userRoles = computed(() => {
+ console.log(useUserStoreHook()?.roles, "useUserStoreHook()?.roles");
+
+ return isAllEmpty(useUserStoreHook()?.roles)
+ ? useUserStoreHook()?.roles
+ : {};
+ });
+
const avatarsStyle = computed(() => {
return username.value ? { marginRight: "10px" } : "";
});
@@ -150,6 +159,7 @@
isCollapse,
pureApp,
username,
+ userRoles,
userAvatar,
avatarsStyle,
tooltipEffect
diff --git a/src/router/modules/mine.ts b/src/router/modules/mine.ts
index 03d2541..47dd1bb 100644
--- a/src/router/modules/mine.ts
+++ b/src/router/modules/mine.ts
@@ -1,7 +1,7 @@
export default {
- path: "/item",
- component: () => import("@/views/item/index.vue"),
- name: "item",
+ path: "/mine",
+ component: () => import("@/views/mine/index.vue"),
+ name: "Mine",
// redirect: "/error/403",
meta: {
icon: "ep/home-filled",
diff --git a/src/views/mine/index.vue b/src/views/mine/index.vue
index d7028b4..edf57fb 100644
--- a/src/views/mine/index.vue
+++ b/src/views/mine/index.vue
@@ -1,11 +1,192 @@
-<script setup lang="ts">
+<script setup lang="tsx">
+import { cusExtendInfo } from "@/api/mine";
+import { message } from "@/utils/message";
+import { onMounted, reactive } from "vue";
+import {
+ addDialog,
+ closeDialog,
+ updateDialog,
+ closeAllDialog
+} from "@/components/ReDialog";
+let state = reactive({
+ userInfo: {}
+});
+onMounted(async () => {
+ let res = await cusExtendInfo();
+ if (res.code == 200) {
+ state.userInfo = res.result;
+ } else {
+ message(res.message || res.result, {
+ type: "error"
+ });
+ }
+});
+const showImg = name => {
+ console.log("鐐瑰嚮鐜�");
+ addDialog({
+ width: "40%",
+ title: "鏌ョ湅钀ヤ笟鎵х収",
+ contentRenderer: () => <img src={state.userInfo[name]} />, // jsx 璇硶 锛堟敞鎰忓湪.vue鏂囦欢鍚敤jsx璇硶锛岄渶瑕佸湪script寮�鍚痩ang="tsx"锛�
+ closeCallBack: ({ options, args }) => {
+ // options.props 鏄搷搴斿紡鐨�
+ // const { formInline } = options.props as FormProps;
+ // const text = `濮撳悕锛�${formInline.user} 鍩庡競锛�${formInline.region}`;
+ if (args?.command === "cancel") {
+ // 鎮ㄧ偣鍑讳簡鍙栨秷鎸夐挳
+ // active.value -= 1;
+ } else if (args?.command === "sure") {
+ } else {
+ }
+ }
+ });
+};
defineOptions({
name: "mine"
});
</script>
<template>
- <div>鎴戞槸涓汉涔嬪績</div>
+ <el-descriptions class="margin-top" title="" :column="3" :size="size" border>
+ <!-- <template #extra>
+ <el-button type="primary">Operation</el-button>
+ </template> -->
+ <el-descriptions-item :span="3">
+ <template #label>
+ <div class="cell-item">浜ゆ槗涓讳綋</div>
+ </template>
+ {{ state.userInfo.transactionCode }}
+ </el-descriptions-item>
+ <el-descriptions-item>
+ <template #label>
+ <div class="cell-item">浼佷笟鍚嶇О</div>
+ </template>
+ {{ state.userInfo.enterpriseName }}
+
+ <span @click="showImg('businessLicense')">
+ <el-link type="primary" underline>鏌ョ湅钀ヤ笟鎵х収</el-link>
+ </span>
+ </el-descriptions-item>
+ <el-descriptions-item>
+ <template #label>
+ <div class="cell-item">缁熶竴绀句細淇＄敤浠ｇ爜</div>
+ </template>
+ {{ state.userInfo.unifiedSocialCreditCode }}
+ </el-descriptions-item>
+ <el-descriptions-item>
+ <template #label>
+ <div class="cell-item">娉ㄥ唽璧勯噾</div>
+ </template>
+ {{ state.userInfo.registeredCapital }}
+ </el-descriptions-item>
+ <el-descriptions-item>
+ <template #label>
+ <div class="cell-item">浼佷笟绫诲瀷</div>
+ </template>
+ {{ state.userInfo.enterpriseType }}
+ </el-descriptions-item>
+ <el-descriptions-item>
+ <template #label>
+ <div class="cell-item">浣忔墍鍦�</div>
+ </template>
+ {{ state.userInfo.residence }}
+ </el-descriptions-item>
+ <el-descriptions-item>
+ <template #label>
+ <div class="cell-item">鑱旂郴鐢佃瘽</div>
+ </template>
+ {{ state.userInfo.legalRepresentativePhone }}
+ </el-descriptions-item>
+ <el-descriptions-item>
+ <template #label>
+ <div class="cell-item">鎴愮珛鏃堕棿</div>
+ </template>
+ {{ state.userInfo.establishmentTime }}
+ </el-descriptions-item>
+ <el-descriptions-item :span="2">
+ <template #label>
+ <div class="cell-item">鐢靛瓙閭</div>
+ </template>
+ {{ state.userInfo.enterpriseEmail }}
+ </el-descriptions-item>
+ <el-descriptions-item :span="3" label-width="100">
+ <template #label>
+ <div class="cell-item">涓昏惀涓氬姟</div>
+ </template>
+ {{ state.userInfo.mainBusiness }}
+ </el-descriptions-item>
+
+ <el-descriptions-item>
+ <template #label>
+ <div class="cell-item">娉曞畾浠ｈ〃浜�</div>
+ </template>
+ {{ state.userInfo.legalRepresentativeName }}
+ </el-descriptions-item>
+ <el-descriptions-item>
+ <template #label>
+ <div class="cell-item">韬唤璇�</div>
+ </template>
+ {{ state.userInfo.legalRepresentativeIdNumber }}
+ <span @click="showImg('legalRepresentativeIdCard')">
+ <el-link type="primary" underline>鏌ョ湅韬唤璇�</el-link>
+ </span>
+ </el-descriptions-item>
+ <el-descriptions-item>
+ <template #label>
+ <div class="cell-item">鑱旂郴鐢佃瘽</div>
+ </template>
+ {{ state.userInfo.legalRepresentativePhone }}
+ </el-descriptions-item>
+ <el-descriptions-item>
+ <template #label>
+ <div class="cell-item">涓氬姟缁忓姙浜�</div>
+ </template>
+ {{ state.userInfo.operatorName }}
+ </el-descriptions-item>
+ <el-descriptions-item>
+ <template #label>
+ <div class="cell-item">韬唤璇�</div>
+ </template>
+ {{ state.userInfo.operatorIdNumber }}
+ <span style="margin-right: auto" @click="showImg('operatorIdCard')">
+ <el-link type="primary" underline>鏌ョ湅韬唤璇�</el-link>
+ </span>
+ </el-descriptions-item>
+ <el-descriptions-item>
+ <template #label>
+ <div class="cell-item">鑱旂郴鐢佃瘽</div>
+ </template>
+ {{ state.userInfo.operatorPhone }}
+ </el-descriptions-item>
+ <el-descriptions-item>
+ <template #label>
+ <div class="cell-item">寮�鎴烽摱琛�</div>
+ </template>
+ {{ state.userInfo.bankName }}
+ </el-descriptions-item>
+ <el-descriptions-item>
+ <template #label>
+ <div class="cell-item">閾惰璐﹀彿</div>
+ </template>
+ {{ state.userInfo.bankAccount }}
+ </el-descriptions-item>
+ </el-descriptions>
</template>
-<style lang="sass" scoped></style>
+<style lang="scss">
+.el-descriptions {
+ margin-top: 20px;
+}
+.cell-item {
+ display: flex;
+ align-items: center;
+}
+.flex-between {
+ height: 100%;
+ display: flex;
+ justify-content: space-between;
+}
+.element {
+ position: absolute;
+ right: 0;
+}
+</style>
diff --git a/src/views/register/registernav.vue b/src/views/register/registernav.vue
index f3973cc..27338d8 100644
--- a/src/views/register/registernav.vue
+++ b/src/views/register/registernav.vue
@@ -398,6 +398,8 @@
</template>
<script setup lang="tsx">
import { h, ref, reactive, onMounted } from "vue";
+import { useNav } from "@/layout/hooks/useNav";
+import { useUserStoreHook } from "@/store/modules/user";
import type { FormInstance, FormRules, UploadProps } from "element-plus";
import { message } from "@/utils/message";
import { baseUrlApi } from "@/api/util";
@@ -415,7 +417,7 @@
import { getToken } from "@/utils/auth";
import { useRoute, useRouter } from "vue-router";
const router = useRouter();
-const route = useRoute();
+const { route, username, userRoles } = useNav();
defineOptions({
name: "RegisterNav"
@@ -596,6 +598,13 @@
};
// 椤甸潰鍒濆鍖�
onMounted(async () => {
+ // console.log(
+ // userRoles.code,
+ // username.value,
+ // "hhhhhhh",
+ // storageLocal().getItem<DataInfo<number>>(userKey)?.roles
+ // );
+ // console.log(useUserStoreHook()?.roles, "useUserStoreHook()?.roles");
state.ruleForm.transactionCode = route.query.code;
// 浼佷笟绫诲瀷
let res = await enterpriseTypes();
--
Gitblit v1.9.1