Skip to content

phsl / client

Go to a project
Commit 48b9bec6 by 赵月辉
Options

c端接口对接完成

parent 4b53d612
Showing with 135 additions and 137 deletions
src/api/home.js
import request from '@/utils/request' import request from '@/utils/request'
// 获取首页banner
export function banner (query) {
return request({
url: '/api/v1/banner',
method: 'get',
params: query
})
}
// 获取组件服务列表数据 // 获取组件服务列表数据
export function assemblyList (query) { export function assemblyList (query) {
return request({ return request({
...@@ -19,6 +28,7 @@ export function informationList (query) { ...@@ -19,6 +28,7 @@ export function informationList (query) {
}) })
} }
// 获取活动资讯详情 // 获取活动资讯详情
export function informationDetail (query) { export function informationDetail (query) {
return request({ return request({
...@@ -27,3 +37,12 @@ export function informationDetail (query) { ...@@ -27,3 +37,12 @@ export function informationDetail (query) {
params: query params: query
}) })
} }
// 获取合作伙伴列表
export function partnerList (query) {
return request({
url: '/api/v1/partnerList',
method: 'get',
params: query
})
}
src/layout/components/Navbar.vue
...@@ -24,7 +24,7 @@ ...@@ -24,7 +24,7 @@
</el-tooltip> </el-tooltip>
</template> </template>
<div class="avatar-container"> <div class="avatar-container">
<el-dropdown @command="handleCommand" class="right-menu-item hover-effect" trigger="click"> <el-dropdown @command="handleCommand" class="right-menu-item hover-effect">
<div class="avatar-wrapper"> <div class="avatar-wrapper">
<img :src="userStore.avatar" class="user-avatar"/> <img :src="userStore.avatar" class="user-avatar"/>
<el-icon> <el-icon>
......
src/layout/user-layout.vue
...@@ -43,13 +43,23 @@ ...@@ -43,13 +43,23 @@
</el-menu> </el-menu>
</div> </div>
<div class="right-menu"> <div class="right-menu flex-align-center">
<!-- {{ userStore.id}}--> <router-link v-if="userStore.id" to="/console/overview" class="console">控制台</router-link>
<el-dropdown v-if="userStore.id" @command="handleCommand" class="">
<div v-if="userStore.id" class="avatar-wrapper flex-align-center"> <div v-if="userStore.id" class="avatar-wrapper flex-align-center">
<router-link to="/console/overview" class="console">控制台</router-link>
<img :src="userStore.avatar" class="user-avatar"/> <img :src="userStore.avatar" class="user-avatar"/>
<div class="user-name">{{ userStore.name }}</div> <div class="user-name">{{ userStore.name }}</div>
</div> </div>
<template #dropdown>
<el-dropdown-menu>
<el-dropdown-item command="logout">
<span>退出登录</span>
</el-dropdown-item>
</el-dropdown-menu>
</template>
</el-dropdown>
<el-button v-else type="primary" @click="$router.push('/login')">登录/注册</el-button> <el-button v-else type="primary" @click="$router.push('/login')">登录/注册</el-button>
</div> </div>
</div> </div>
...@@ -65,6 +75,7 @@ import AppMain from '@/layout/components/AppMain.vue' ...@@ -65,6 +75,7 @@ import AppMain from '@/layout/components/AppMain.vue'
import { computilityMenu } from '@/api/computingResource.js' import { computilityMenu } from '@/api/computingResource.js'
import { industryMenu } from '@/api/industry.js' import { industryMenu } from '@/api/industry.js'
import useUserStore from '@/store/modules/user.js' import useUserStore from '@/store/modules/user.js'
import { ElMessageBox } from 'element-plus'
const userStore = useUserStore() const userStore = useUserStore()
const route = useRoute() const route = useRoute()
...@@ -100,6 +111,32 @@ function getIndustryMenu () { ...@@ -100,6 +111,32 @@ function getIndustryMenu () {
getComputilityMenu() getComputilityMenu()
getIndustryMenu() getIndustryMenu()
function handleCommand (command) {
switch (command) {
case 'setLayout':
// setLayout()
break
case 'logout':
logout()
break
default:
break
}
}
function logout () {
ElMessageBox.confirm('确定退出账号吗？', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
userStore.logOut().then(() => {
location.href = '/index'
})
}).catch(() => {
})
}
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
......
src/views/componentServices/list.vue
...@@ -2,89 +2,14 @@ ...@@ -2,89 +2,14 @@
<div class="app-container"> <div class="app-container">
<div style="width: 1280px;margin: 0 auto"> <div style="width: 1280px;margin: 0 auto">
<el-row :gutter="24"> <el-row :gutter="24">
<el-col :span="6"> <el-col v-for="item in assemblyData" :key="item.id" :span="6">
<div class="item flex"> <div class="item flex">
<img src="@/assets/images/temporary-icon.png" alt=""> <img :src="baseUrl + item.image" alt="">
<div> <div>
<div class="title">标普信息</div> <div class="title">{{ item.title }}</div>
<p>政务数据应用</p> <p>{{ item.description }}</p>
<el-button type="primary" link>查看详情 <el-button type="primary" link @click="openPage(item)">查看详情
<el-icon>
<ArrowRight/>
</el-icon>
</el-button>
</div>
</div>
</el-col>
<el-col :span="6">
<div class="item flex">
<img src="@/assets/images/temporary-icon.png" alt="">
<div>
<div class="title">标普信息</div>
<p>政务数据应用</p>
<el-button type="primary" link>查看详情
<el-icon>
<ArrowRight/>
</el-icon>
</el-button>
</div>
</div>
</el-col>
<el-col :span="6">
<div class="item flex">
<img src="@/assets/images/temporary-icon.png" alt="">
<div>
<div class="title">标普信息</div>
<p>政务数据应用</p>
<el-button type="primary" link>查看详情
<el-icon>
<ArrowRight/>
</el-icon>
</el-button>
</div>
</div>
</el-col>
<el-col :span="6">
<div class="item flex">
<img src="@/assets/images/temporary-icon.png" alt="">
<div>
<div class="title">标普信息</div>
<p>政务数据应用</p>
<el-button type="primary" link>查看详情
<el-icon>
<ArrowRight/>
</el-icon>
</el-button>
</div>
</div>
</el-col>
<el-col :span="6">
<div class="item flex">
<img src="@/assets/images/temporary-icon.png" alt="">
<div>
<div class="title">标普信息</div>
<p>政务数据应用</p>
<el-button type="primary" link>查看详情
<el-icon>
<ArrowRight/>
</el-icon>
</el-button>
</div>
</div>
</el-col>
<el-col :span="6">
<div class="item flex">
<img src="@/assets/images/temporary-icon.png" alt="">
<div>
<div class="title">标普信息</div>
<p>政务数据应用</p>
<el-button type="primary" link>查看详情
<el-icon> <el-icon>
<ArrowRight/> <ArrowRight/>
</el-icon> </el-icon>
...@@ -98,7 +23,23 @@ ...@@ -98,7 +23,23 @@
</template> </template>
<script setup name="ComponentServicesList"> <script setup name="ComponentServicesList">
import { ref } from 'vue'
import { assemblyList } from '@/api/home.js'
const baseUrl = import.meta.env.VITE_APP_BASE_API
const assemblyData = ref([])
function getAassemblyList () {
assemblyList().then(res => {
assemblyData.value = res.data
})
}
getAassemblyList()
function openPage (data) {
window.open(data.url)
}
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.app-container { .app-container {
...@@ -112,7 +53,7 @@ ...@@ -112,7 +53,7 @@
background: #FBFCFE; background: #FBFCFE;
border-radius: 3px; border-radius: 3px;
border: 1px solid #D8D9DB; border: 1px solid #D8D9DB;
padding: 24px; padding: 24px 24px 0 24px;
margin-bottom: 24px; margin-bottom: 24px;
.title { .title {
...@@ -126,7 +67,13 @@ ...@@ -126,7 +67,13 @@
font-size: 16px; font-size: 16px;
color: #626566; color: #626566;
margin-top: 5px; margin-top: 5px;
margin-bottom: 40px; margin-bottom: 10px;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 3;
max-height: 100px;
-webkit-box-orient: vertical;
} }
img { img {
......
src/views/index.vue
<template> <template>
<div class="app-container home"> <div class="app-container home">
<div class="banner"> <div class="banner">
<img src="@/assets/images/banner.png" alt=""> <el-carousel height="600px" :indicator-position="bannerImgList.length <= 1 ? 'none':'' ">
<el-carousel-item v-for="item in bannerImgList" :key="item">
<img :src="baseUrl + item.image" alt="">
</el-carousel-item>
</el-carousel>
</div> </div>
<div class="block" style="margin-bottom: 76px"> <div class="block" style="margin-bottom: 76px">
...@@ -90,7 +94,7 @@ ...@@ -90,7 +94,7 @@
生态合作伙伴 生态合作伙伴
</div> </div>
<div class="desc">服务全球300万+客户，合作伙伴可绕地球3圈</div> <div class="desc">服务全球300万+客户，合作伙伴可绕地球3圈</div>
<el-button class="view-more-btn">查看更多 <el-button class="view-more-btn" @click="$router.push('/partnership/partnershipList')">查看更多
<el-icon> <el-icon>
<ArrowRight/> <ArrowRight/>
</el-icon> </el-icon>
...@@ -152,12 +156,23 @@ ...@@ -152,12 +156,23 @@
</template> </template>
<script setup name="Index"> <script setup name="Index">
import { assemblyList, informationList } from '@/api/home.js' import { banner, assemblyList, informationList } from '@/api/home.js'
import { ref } from 'vue' import { ref } from 'vue'
const baseUrl = import.meta.env.VITE_APP_BASE_API const baseUrl = import.meta.env.VITE_APP_BASE_API
const assemblyData = ref([]) const assemblyData = ref([])
const bannerImgList = ref([])
function getBanner () {
banner().then(res => {
bannerImgList.value = res.data
console.log(res)
})
}
getBanner()
function getAassemblyList () { function getAassemblyList () {
assemblyList().then(res => { assemblyList().then(res => {
assemblyData.value = res.data.length > 3 ? res.data.slice(0, 3) : res.data assemblyData.value = res.data.length > 3 ? res.data.slice(0, 3) : res.data
...@@ -190,6 +205,9 @@ getInformation() ...@@ -190,6 +205,9 @@ getInformation()
function openAssembly (data) { function openAssembly (data) {
window.open(data.url) window.open(data.url)
} }
function openPartnership () {
}
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
...@@ -207,6 +225,8 @@ function openAssembly (data) { ...@@ -207,6 +225,8 @@ function openAssembly (data) {
img { img {
display: block; display: block;
width: 100%; width: 100%;
height: 100%;
object-fit: cover;
} }
} }
...@@ -275,7 +295,7 @@ function openAssembly (data) { ...@@ -275,7 +295,7 @@ function openAssembly (data) {
.resource-item, .application-item { .resource-item, .application-item {
&:hover { &:hover {
cursor: pointer; cursor: pointer;
box-shadow: 0 0 10px 0 #eeeeee; box-shadow: 0 0 10px 0 #dbdada;
} }
.title { .title {
...@@ -380,7 +400,6 @@ function openAssembly (data) { ...@@ -380,7 +400,6 @@ function openAssembly (data) {
&:hover { &:hover {
cursor: pointer; cursor: pointer;
box-shadow: 0 0 10px 0 #eeeeee;
.date { .date {
color: #2E77E3; color: #2E77E3;
......
src/views/partnership/list.vue
...@@ -2,66 +2,42 @@ ...@@ -2,66 +2,42 @@
<div class="app-container"> <div class="app-container">
<div style="width: 1280px;margin: 0 auto"> <div style="width: 1280px;margin: 0 auto">
<el-row :gutter="24"> <el-row :gutter="24">
<el-col :span="8"> <el-col v-for="item in partnerData" :span="8">
<div class="item"> <div class="item">
<img src="@/assets/images/temporary-icon.png" alt=""> <img :src="baseUrl + item.image" alt="">
<div class="title">TikTok</div> <div class="title">{{ item.title }}</div>
<p>赞同科技，一家领先的银行业IT解决方案提供商，携手腾讯云打造全新的云银行解决方案，融合云计算、AI等技术，解决客户多场景业务办理的需求痛点，实现了银行服务的线上化、个性化和智能化。</p> <p>{{ item.description }}</p>
<el-button type="primary" link @click="openPage(item)">查看官网
<el-button type="primary" link>查看官网
<el-icon>
<ArrowRight/>
</el-icon>
</el-button>
</div>
</el-col>
<el-col :span="8">
<div class="item">
<img src="@/assets/images/temporary-icon.png" alt="">
<div class="title">TikTok</div>
<p>赞同科技，一家领先的银行业IT解决方案提供商，携手腾讯云打造全新的云银行解决方案，融合云计算、AI等技术，解决客户多场景业务办理的需求痛点，实现了银行服务的线上化、个性化和智能化。</p>
<el-button type="primary" link>查看官网
<el-icon>
<ArrowRight/>
</el-icon>
</el-button>
</div>
</el-col>
<el-col :span="8">
<div class="item">
<img src="@/assets/images/temporary-icon.png" alt="">
<div class="title">TikTok</div>
<p>赞同科技，一家领先的银行业IT解决方案提供商，携手腾讯云打造全新的云银行解决方案，融合云计算、AI等技术，解决客户多场景业务办理的需求痛点，实现了银行服务的线上化、个性化和智能化。</p>
<el-button type="primary" link>查看官网
<el-icon>
<ArrowRight/>
</el-icon>
</el-button>
</div>
</el-col>
<el-col :span="8">
<div class="item">
<img src="@/assets/images/temporary-icon.png" alt="">
<div class="title">TikTok</div>
<p>赞同科技，一家领先的银行业IT解决方案提供商，携手腾讯云打造全新的云银行解决方案，融合云计算、AI等技术，解决客户多场景业务办理的需求痛点，实现了银行服务的线上化、个性化和智能化。</p>
<el-button type="primary" link>查看官网
<el-icon> <el-icon>
<ArrowRight/> <ArrowRight/>
</el-icon> </el-icon>
</el-button> </el-button>
</div> </div>
</el-col> </el-col>
</el-row> </el-row>
</div> </div>
</div> </div>
</template> </template>
<script setup name="partnershipList"> <script setup name="partnershipList">
import { partnerList } from '@/api/home.js'
const baseUrl = import.meta.env.VITE_APP_BASE_API
const partnerData = ref([])
function getPartnerList () {
partnerList().then(res => {
console.log(res)
partnerData.value = res.data
})
}
getPartnerList()
function openPage (data) {
window.open(data.url)
}
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.app-container { .app-container {
......
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 sign in to comment