Skip to content

A
ai_web_page_prod
Commit c5f8a27f by haojie
Options

1

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