Commit c5f8a27f by haojie

1

parent 3de978fb
......@@ -11,8 +11,12 @@
<div class="s-header-user-info-dropdown">
<div class="small-userinfo">
<div class="header">
<img class="avatar" :src="imgs.avatar" alt="" />
<span class="user-name">username</span>
<img
class="avatar"
:src="userInfo.avatar ? userInfo.avatar : imgs.avatar"
alt=""
/>
<span class="user-name">{{ userInfo.name ?? '---' }}</span>
</div>
<div class="user-options-box">
<template v-for="item in OptionsList" :key="item.value">
......@@ -29,12 +33,12 @@
</template>
</div>
<div class="line"></div>
<div class="logout-box">退出登录</div>
<div class="logout-box" @click="logout">退出登录</div>
</div>
</div>
</template>
<div class="user-info">
<img :src="imgs.avatar" alt="" />
<img :src="userInfo.avatar ? userInfo.avatar : imgs.avatar" alt="" />
</div>
</t-popup>
</div>
......@@ -42,14 +46,20 @@
<script setup lang="ts">
import { MessagePlugin, Popup as TPopup } from 'tdesign-vue-next';
import { ref } from 'vue';
import { computed, onMounted, ref } from 'vue';
import { useRoute, useRouter } from 'vue-router';
import { getUserInfo } from '@/utils/api/userApi';
import { useStore } from 'vuex';
const imgs = {
avatar: new URL('../assets/svg/header/avatar.svg', import.meta.url).href,
};
const route = useRoute();
const router = useRouter();
const store = useStore();
const user_popup_visible = ref(false);
const userToken = computed(() => store.getters['user/token']);
// 用户信息对象
const userInfo = ref({});
// 选项列表
const OptionsList = [
{
......@@ -80,19 +90,28 @@ const gotoMember = (item: any) => {
window.open(resUrl.href);
user_popup_visible.value = false;
};
// 退出登录和去登陆
const logout = () => {
if (true) {
router.push({
path: '/login',
});
} else {
// 退出
if (true) {
MessagePlugin.success('退出成功');
const logout = async () => {
if (userToken.value) {
await store.dispatch('user/Logout');
user_popup_visible.value = false;
}
};
// 获取用户信息
const getInfo = async () => {
try {
let res: any = await getUserInfo();
if (res.code == 0) {
userInfo.value = res.data;
}
} catch (e) {
console.log(e);
}
};
onMounted(() => {
getInfo();
});
</script>
<style lang="less">
......@@ -104,6 +123,11 @@ const logout = () => {
.up-icon {
padding-left: 12px;
}
img {
width: 44px;
height: 44px;
border-radius: 50%;
}
}
.user-popup {
.t-popup__content {
......
......@@ -12,13 +12,13 @@
</template>
<script lang="ts" setup>
import Header from "./header.vue";
import { useRoute } from "vue-router";
import Header from './header.vue';
import { useRoute } from 'vue-router';
const route = useRoute();
</script>
<style lang="less">
@import "@/style/flex.less";
@import '@/style/flex.less';
.custom-layout {
height: 100%;
.dj();
......@@ -35,6 +35,7 @@ const route = useRoute();
box-sizing: border-box;
min-width: 90vw;
padding: 0 30px;
height: 100%;
}
}
}
......
......@@ -29,9 +29,9 @@
<SwiperSlide v-for="(item, index) in ScrollList.list" :key="index">
<CustomCardTwo
@click="goDetail(item)"
:img="item.img"
:img="item.image"
:title="item.title"
:content="item.content"
:content="item.description"
></CustomCardTwo>
</SwiperSlide>
</Swiper>
......@@ -43,7 +43,7 @@
</template>
<script lang="ts" setup>
import { defineComponent, onMounted, reactive, ref } from 'vue';
import { defineComponent, onBeforeMount, reactive, ref } from 'vue';
import './index.less';
import { Swiper, SwiperSlide } from 'swiper/vue';
import { Pagination, Navigation, Autoplay } from 'swiper';
......@@ -51,6 +51,7 @@ import 'swiper/css';
import 'swiper/css/pagination';
import CustomCardTwo from '@/components/card2.vue';
import { useRouter } from 'vue-router';
import { getScenesList } from '@/utils/api/scenes';
const router = useRouter();
/**
* spaceBetween 每个swiper-slide的间隔距离
......@@ -63,64 +64,31 @@ const imgs = {
};
const modules = ref([Navigation, Autoplay]);
const ScrollList = reactive({
list: [
{
img: new URL('../../../../assets/img/clothes.jpeg', import.meta.url).href,
title: '亚马逊工具',
content: `
产品主图制作、产品文案生成、模仿A+产品、五
点描述生成等......`,
},
{
img: new URL('../../../../assets/img/mote.jpeg', import.meta.url).href,
title: '亚马逊工具',
content: `
产品主图制作、产品文案生成、模仿A+产品、五
点描述生成等......`,
},
{
img: new URL('../../../../assets/img/clothes.jpeg', import.meta.url).href,
title: '亚马逊工具',
content: `
产品主图制作、产品文案生成、模仿A+产品、五
点描述生成等......`,
},
{
img: new URL('../../../../assets/img/mote.jpeg', import.meta.url).href,
title: '亚马逊工具',
content: `
产品主图制作、产品文案生成、模仿A+产品、五
点描述生成等......`,
},
{
img: new URL('../../../../assets/img/mote.jpeg', import.meta.url).href,
title: '亚马逊工具',
content: `
产品主图制作、产品文案生成、模仿A+产品、五
点描述生成等......`,
},
{
img: new URL('../../../../assets/img/mote.jpeg', import.meta.url).href,
title: '亚马逊工具',
content: `
产品主图制作、产品文案生成、模仿A+产品、五
点描述生成等......`,
},
{
img: new URL('../../../../assets/img/mote.jpeg', import.meta.url).href,
title: '亚马逊工具',
content: `
产品主图制作、产品文案生成、模仿A+产品、五
点描述生成等......`,
},
{
img: new URL('../../../../assets/img/mote.jpeg', import.meta.url).href,
title: '亚马逊工具',
content: `
产品主图制作、产品文案生成、模仿A+产品、五
点描述生成等......`,
},
],
list: [],
});
const getSwiperList = async () => {
try {
let res: any = await getScenesList();
if (res.code == 0 && res.data.length) {
if (res.data.length < 8) {
let list = JSON.parse(JSON.stringify(res.data));
// 复制item
for (let i = 0; i < 8; i++) {
if (res.data.length >= 8) {
break;
}
res.data = res.data.concat(list);
}
}
ScrollList.list = res.data;
}
} catch (e) {
console.log(e);
}
};
onBeforeMount(async () => {
// 获取轮播图列表
await getSwiperList();
});
const goDetail = (item: any) => {
console.log(item);
......
import { TOKEN_NAME, APP_COOKIE } from '@/config/global';
import Cookies from 'js-cookie';
import { getConfigPolicy } from '@/utils/api/userApi';
import { getConfigPolicy, useLogout } from '@/utils/api/userApi';
import { show_message } from '@/utils/tdesign_tool';
interface MyState {
token: String | undefined | null;
account: number | string;
......@@ -82,6 +83,15 @@ const actions = {
console.log(e);
}
},
// 退出登录
async Logout({ commit }: any) {
try {
let res: any = await useLogout();
show_message('退出成功', 'success');
} catch (e) {
console.log(e);
}
},
};
export default {
......
import { getUserCookie } from './userApi';
import request from '../request';
// 场景模块
// 获取场景列表
export const getScenesList = () => {
return request.get('/api/scenarios', {
headers: {
authorization: `Bearer ${getUserCookie()}`,
},
});
};
// 获取场景推荐列表
export const getScenariosRecommend = () => {
return request.get('/api/scenarios/recommend', {
headers: {
authorization: `Bearer ${getUserCookie()}`,
},
});
};
......@@ -11,6 +11,28 @@ export const UserLogin = (data: any) => {
});
};
// 退出登录
export const useLogout = () => {
return request.post(
'/api/users/logout',
{},
{
headers: {
authorization: `Bearer ${getUserCookie()}`,
},
}
);
};
// 获取用户信息
export const getUserInfo = () => {
return request.get('/api/users/info', {
headers: {
authorization: `Bearer ${getUserCookie()}`,
},
});
};
// 获取后台配置
export const getAdminConfig = () => {
let token = getUserCookie();
......@@ -32,19 +54,6 @@ export const getConfigPolicy = (data: any) => {
});
};
// 退出登录
export const useLogout = () => {
return request.post(
'/api/users/logout',
{},
{
headers: {
authorization: `Bearer ${getUserCookie()}`,
},
}
);
};
// 提交任务
export const useSubmitTask = (data: any) => {
return request.post(
......
......@@ -12,7 +12,7 @@ export default defineConfig(({ command, mode }) => {
let newDate = `${date.getFullYear()}-${
date.getMonth() + 1
}-${date.getDate()}--${date.getHours()}.${date.getMinutes()}`;
let api = 0 ? 'http://42.194.143.229:90' : 'http://test.phpgpt.com';
let api = 0 ? 'http://42.194.143.229:90' : 'http://ai-gpt.test';
return {
base: '/',
resolve: {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment