Переглянути джерело

add 管理中心-用户中心-应用信息

Funny 3 роки тому
батько
коміт
84785d7d60

+ 27 - 6
src/App.vue

@@ -4,7 +4,7 @@ import { useRouter } from 'vue-router';
 import emitter from '@/util/eventBus'
 const router = useRouter()
 let nickName = ref<string>('')
-let avatar = ref<string>('')
+let avatar = ref<string>('https://joeschmoe.io/api/v1/random')
 let isTop = ref(true)
 let activeIndex = ref(0)
 let menuList = ref(['首页', '优巨引擎官网', '文档中心', '管理中心'])
@@ -39,13 +39,13 @@ onMounted(() => {
   if (userInfo) {
     let info = JSON.parse(userInfo)
     nickName.value = info.nickname
-    avatar.value = info.avatar
+    avatar.value = info.avatar || 'https://joeschmoe.io/api/v1/random'
   }
   emitter.on('userInfo', (e: any) => {
     let userInfo = JSON.parse(e)
     console.log('userInfo:', userInfo);
     nickName.value = userInfo.nickname
-    avatar.value = userInfo.avatar
+    avatar.value = userInfo.avatar || 'https://joeschmoe.io/api/v1/random'
   })
 })
 function handleScrollY() {
@@ -56,6 +56,26 @@ const loginOut = () => {
   visible.value = false
   nickName.value = ''
   avatar.value = ''
+  router.push('/')
+}
+const menu = (i: number) => {
+  activeIndex.value = i
+  switch (i) {
+    case 0:
+      router.push('/')
+      break;
+    case 1:
+      window.open("http://www.liebaoai.cn/", "_blank");
+      break;
+    case 2:
+      router.push('/development')
+      break;
+    case 3:
+      router.push('/management/appInfo')
+      break;
+    default:
+      break;
+  }
 }
 </script>
 
@@ -71,7 +91,7 @@ const loginOut = () => {
           <div class="name">优巨引擎·开放平台</div>
         </div>
         <div class="right">
-          <div @click="activeIndex = i" class="btn" v-for="(v, i) in menuList" :key="i"
+          <div @click="menu(i)" class="btn hover:text-blue-400" v-for="(v, i) in menuList" :key="i"
             :class="activeIndex === i && !isTop ? 'active-btn' : ''">
             {{ v }}</div>
           <template v-if="nickName">
@@ -88,7 +108,8 @@ const loginOut = () => {
                 </div>
               </template>
               <div class="flex items-center cursor-pointer">
-                <img class="w-30px h-30px rounded-1/2 mr-10px" :src="avatar" alt="">
+                <!-- <img class="w-30px h-30px rounded-1/2 mr-10px" :src="avatar" alt=""> -->
+                <a-avatar size="30" :src="avatar" class="bg-[#f7f7f7]"></a-avatar>
                 <div class="text-18">{{ nickName }}</div>
               </div>
             </a-tooltip>
@@ -204,7 +225,7 @@ const loginOut = () => {
 
       .btn {
         font-size: 15px;
-        margin-right: 20px;
+        margin-right: 40px;
         cursor: pointer;
       }
 

+ 13 - 0
src/api/index.ts

@@ -29,3 +29,16 @@ export const userInfo = () => {
   return get('app/member/detail')
 }
 
+// 应用信息信息
+export const appInfo = () => {
+  return get('app/appSecret/info')
+}
+// 提交回调地址
+export const setCallback = (params: any) => {
+  return post('app/set/callback/url', params)
+}
+
+
+
+
+

+ 20 - 3
src/router/index.ts

@@ -4,17 +4,34 @@ const routes = [
   {
     path: "/",
     name: "home",
-    component: ()=> import('@/views/home/index.vue'),
+    component: () => import('@/views/home/index.vue'),
   },
   {
     path: "/register",
     name: "register",
-    component: ()=> import('@/views/register/index.vue'),
+    component: () => import('@/views/register/index.vue'),
   },
   {
     path: "/login",
     name: "login",
-    component: ()=> import('@/views/login/index.vue'),
+    component: () => import('@/views/login/index.vue'),
+  },
+  {
+    path: "/development",
+    name: "development",
+    component: () => import('@/views/development/index.vue'),
+  },
+  {
+    path: "/management",
+    name: "management",
+    component: () => import('@/views/management/index.vue'),
+    children: [
+      {
+        path: "/management/appInfo",
+        name: "appInfo",
+        component: () => import('@/views/management/userCenter/appInfo.vue'),
+      }
+    ]
   }
 ];
 

+ 12 - 0
src/views/development/index.vue

@@ -0,0 +1,12 @@
+<script setup lang='ts'>
+import { onMounted,ref} from 'vue'
+
+onMounted(() => {
+
+})
+</script>
+<template>
+  <div>文档中心</div>
+</template>
+<style lang='scss' scoped>
+</style>

+ 2 - 2
src/views/login/index.vue

@@ -68,7 +68,7 @@ const loginPw = () => {
       localStorage.setItem("token", res.data.token);
       getUserInfo()
     } else {
-      return message.error(res.msg);
+      return message.error(res.message);
     }
   })
 }
@@ -78,7 +78,7 @@ const loginCode = () => {
       localStorage.setItem("token", res.data.token);
       getUserInfo()
     } else {
-      return message.error(res.msg);
+      return message.error(res.message);
     }
   })
 }

+ 46 - 0
src/views/management/index.vue

@@ -0,0 +1,46 @@
+<script setup lang='ts'>
+import { MenuProps } from 'ant-design-vue';
+import { onMounted, ref } from 'vue'
+import router from '@/router'
+const selectedKeys = ref<string[]>(['0-0']);
+const openKeys = ref<number[]>([0]);
+const menuList = ref([
+  {
+    name: '用户中心',
+    items: [
+      {
+        name: '应用信息',
+        path: '/management/appInfo'
+      }
+    ]
+  }
+])
+const handleClick: MenuProps['onClick'] = e => {
+  console.log('click', e);
+};
+onMounted(() => {
+
+})
+</script>
+<template>
+  <div class="flex pt-60px w-screen bg-[#f2f4fb] dev-h">
+    <div class="h-full bg-white w-256px">
+      <a-menu id="dddddd" v-model:openKeys="openKeys" v-model:selectedKeys="selectedKeys" style="width: 256px"
+        mode="inline" @click="handleClick">
+        <a-sub-menu :key="i" v-for="(v, i) in menuList">
+          <template #title>{{ v.name }}</template>
+          <a-menu-item @click="router.push(item.path)" v-if="v.items.length" v-for="(item, index) in v.items"
+            :key="`${i}-${index}`">应用信息</a-menu-item>
+        </a-sub-menu>
+      </a-menu>
+    </div>
+    <div class="w-full h-full px-20px py-20px">
+      <router-view></router-view>
+    </div>
+  </div>
+</template>
+<style lang='scss' scoped>
+.dev-h {
+  height: calc(100vh - 80px);
+}
+</style>

+ 96 - 0
src/views/management/userCenter/appInfo.vue

@@ -0,0 +1,96 @@
+<script setup lang='ts'>
+import { appInfo, setCallback } from '@/api'
+import { message } from 'ant-design-vue';
+import { onMounted, reactive, ref, UnwrapRef } from 'vue'
+interface Application {
+  id?: number,
+  sandbox: number,
+  appId: string,
+  appSecret: string,
+  storeStatusNotifyUrl: string,
+  orderStatusNotifyUrl: string
+
+}
+let applicationInfo = reactive<Application>({
+  sandbox: 0,
+  appId: '',
+  appSecret: '',
+  storeStatusNotifyUrl: '',
+  orderStatusNotifyUrl: ''
+})
+onMounted(() => {
+
+})
+const getAppInfo = () => {
+  appInfo().then((res: any) => {
+    console.log('app信息:', res);
+    if (res.code === 0) {
+      // applicationInfo = reactive<Application>(res.data[0])
+      Object.assign(applicationInfo, res.data[0])
+    } else {
+      message.error(res.message)
+    }
+  })
+}
+getAppInfo()
+const submit = () => {
+  setCallback({ id: applicationInfo.id, storeStatusNotifyUrl: applicationInfo.storeStatusNotifyUrl, orderStatusNotifyUrl: applicationInfo.orderStatusNotifyUrl }).then((res: any) => {
+    console.log('res:', res);
+  })
+}
+</script>
+<template>
+  <div class="px-30px py-30px w-full h-full rounded-10px bg-white">
+    <div class="text-20px text-[#222222] font-bold">应用信息</div>
+    <div v-if="applicationInfo.sandbox" class="mt-30px ml-30px">
+      <div class="relative text-16px font-500 text-[#333333] leading-19px line-title">正式环境</div>
+      <div class="text-14px text-[#666666] font-500 ml-30px">
+        <div class="flex items-center mt-20px">
+          <p class="w-100px text-right mr-10px">App Key:</p>
+          <p>{{ applicationInfo.appId }}</p>
+        </div>
+        <div class="flex items-center mt-20px">
+          <p class="w-100px text-right mr-10px">App Secret:</p>
+          <p>{{ applicationInfo.appSecret }}</p>
+        </div>
+      </div>
+    </div>
+    <div v-else class="mt-30px ml-30px">
+      <div class="relative text-16px font-500 text-[#333333] leading-19px line-title">测试环境</div>
+      <div class="text-14px text-[#666666] font-500 ml-30px">
+        <div class="flex items-center mt-20px">
+          <p class="w-100px text-right mr-10px">App Key:</p>
+          <p>{{ applicationInfo.appId }}</p>
+        </div>
+        <div class="flex items-center mt-20px">
+          <p class="w-100px text-right mr-10px">App Secret:</p>
+          <p>{{ applicationInfo.appSecret }}</p>
+        </div>
+      </div>
+    </div>
+    <div class="text-20px text-[#222222] font-bold mt-100px">联调商户</div>
+    <div class="text-20px text-[#222222] font-bold mt-100px">回调地址</div>
+    <a-form :model="applicationInfo" class="w-400px mt-30px ml-70px">
+      <a-form-item label="门店URL地址:" name="storeStatusNotifyUrl">
+        <a-input v-model:value="applicationInfo.storeStatusNotifyUrl" placeholder="请输入门店URL地址" />
+      </a-form-item>
+      <a-form-item label="订单URL地址:" name="orderStatusNotifyUrl">
+        <a-input v-model:value="applicationInfo.orderStatusNotifyUrl" placeholder="请输入订单URL地址" />
+      </a-form-item>
+      <a-form-item :wrapper-col="{ offset: 8, span: 16 }">
+        <a-button @click="submit" type="primary" html-type="submit">提交</a-button>
+      </a-form-item>
+    </a-form>
+  </div>
+</template>
+<style lang='scss' scoped>
+.line-title::before {
+  content: '';
+  position: absolute;
+  left: -7px;
+  top: 4px;
+  height: 12px;
+  width: 2px;
+  background: linear-gradient(141deg, #50A7FF 0%, #1B8DFF 100%);
+}
+</style>

+ 2 - 5
src/views/register/index.vue

@@ -109,7 +109,7 @@ const next = async () => {
     return message.error('俩次输入的密码不一致,请修改为相同密码!')
   }
   let res: any = await verification({ mobile: formState.userAccount, code: formState.code })
-  if (res.code !== 0) {
+  if (res.code !== 200) {
     return message.error(res.message)
   }
   if (!util.mobile(formState.userAccount)) {
@@ -232,9 +232,6 @@ const handleChange3 = (info: UploadChangeParam) => {
 const handleChange4 = (info: UploadChangeParam) => {
   handleChanges(info, 4)
 };
-const toLogin = () => {
-  router.push('/login')
-}
 </script>
 <template>
   <div class=" pt-120px flex flex-col items-center">
@@ -383,7 +380,7 @@ const toLogin = () => {
         <div class="text-24px font-500 text-dark-500 leading-33px mt-30px mb-10px">提交成功</div>
         <div class="flex text-16px text-gray-400">
           <div>恭喜您,资料提交成功,去</div>
-          <div @click="toLogin" class="text-blue-500 cursor-pointer">登录</div>
+          <div @click="router.push('/login')" class="text-blue-500 cursor-pointer">登录</div>
         </div>
       </div>
     </div>