dai
3 years ago
10 changed files with 694 additions and 299 deletions
|
After Width: | Height: | Size: 2.4 KiB |
|
After Width: | Height: | Size: 1.4 MiB |
|
After Width: | Height: | Size: 9.5 KiB |
|
After Width: | Height: | Size: 8.3 KiB |
|
After Width: | Height: | Size: 128 KiB |
@ -0,0 +1,185 @@ |
|||||
|
@import "~@/assets/scss/c/config.scss"; |
||||
|
@import "~@/assets/scss/c/function.scss"; |
||||
|
|
||||
|
.g-cnt { |
||||
|
position: absolute; |
||||
|
top: 0; |
||||
|
left: 0; |
||||
|
right: 0; |
||||
|
bottom: 0; |
||||
|
background-image: url(~@/assets/img/yantai/index/bg.png); |
||||
|
background-size: cover; |
||||
|
background-position: center; |
||||
|
} |
||||
|
|
||||
|
.m-top { |
||||
|
position: absolute; |
||||
|
top: 0; |
||||
|
width: 1920px; |
||||
|
left: -1000px; |
||||
|
right: -1000px; |
||||
|
margin: 0 auto; |
||||
|
|
||||
|
.name { |
||||
|
position: absolute; |
||||
|
top: 0; |
||||
|
left: 0; |
||||
|
text-align: center; |
||||
|
width: 100%; |
||||
|
line-height: 90px; |
||||
|
font-size: 42px; |
||||
|
font-weight: bold; |
||||
|
color: #fff; |
||||
|
background-image: -webkit-linear-gradient(bottom, rgb(23, 222, 238), rgb(23, 222, 238), #fff, #fff); |
||||
|
background-clip: text; |
||||
|
-webkit-background-clip: text; |
||||
|
-webkit-text-fill-color: transparent; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.m-list { |
||||
|
position: absolute; |
||||
|
top: 50%; |
||||
|
left: 0; |
||||
|
right: 0; |
||||
|
margin: auto; |
||||
|
transform: translateY(-50%); |
||||
|
|
||||
|
.list { |
||||
|
display: flex; |
||||
|
justify-content: space-around; |
||||
|
align-items: center; |
||||
|
width: 100%; |
||||
|
margin: 0 auto; |
||||
|
|
||||
|
.menu { |
||||
|
position: relative; |
||||
|
|
||||
|
.menu-list { |
||||
|
position: absolute; |
||||
|
top: 50px; |
||||
|
width: 100%; |
||||
|
left: 0; |
||||
|
|
||||
|
.menu-item { |
||||
|
position: relative; |
||||
|
margin-bottom: 40px; |
||||
|
width: 150px; |
||||
|
height: 70px; |
||||
|
line-height: 70px; |
||||
|
color: rgba(#fff, 0.6); |
||||
|
font-size: 20px; |
||||
|
border-radius: 60px; |
||||
|
text-align: center; |
||||
|
transition: all 0.2s ease; |
||||
|
cursor: pointer; |
||||
|
|
||||
|
&.z-zuo { |
||||
|
left: 60px; |
||||
|
background: linear-gradient(to left, rgba(rgb(67, 67, 210), 0.3), rgba(#00a, 0)); |
||||
|
box-shadow: -4px 4px 6px 0 inset rgba(#fff, 0.2); |
||||
|
&:nth-child(2), |
||||
|
&:nth-child(6) { |
||||
|
margin-left: 20px; |
||||
|
} |
||||
|
&:nth-child(3), |
||||
|
&:nth-child(5) { |
||||
|
margin-left: 20px * 2; |
||||
|
} |
||||
|
&:nth-child(4) { |
||||
|
margin-left: 20px * 2 + 1px; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
&.z-you { |
||||
|
left: 70px; |
||||
|
background: linear-gradient(to right, rgba(rgb(67, 67, 210), 0.3), rgba(#00a, 0)); |
||||
|
box-shadow: 4px 4px 6px 0 inset rgba(#fff, 0.2); |
||||
|
|
||||
|
&:nth-child(2), |
||||
|
&:nth-child(6) { |
||||
|
margin-left: -20px; |
||||
|
} |
||||
|
&:nth-child(3), |
||||
|
&:nth-child(5) { |
||||
|
margin-left: -20px * 2; |
||||
|
} |
||||
|
&:nth-child(4) { |
||||
|
margin-left: -20px * 2 - 1px; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
&:hover, |
||||
|
&.z-on { |
||||
|
transform: scale(1.15); |
||||
|
color: rgba(#fff, 0.95); |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.arrow { |
||||
|
width: 60px; |
||||
|
margin: 0 20px; |
||||
|
} |
||||
|
|
||||
|
.item { |
||||
|
position: relative; |
||||
|
margin: 0 50px; |
||||
|
width: 420px; |
||||
|
|
||||
|
.item-wrap { |
||||
|
text-align: center; |
||||
|
cursor: pointer; |
||||
|
transition: all 0.2s ease; |
||||
|
&:hover { |
||||
|
transform: scale(1.1); |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
&.z-on { |
||||
|
.name { |
||||
|
color: #ffffff; |
||||
|
background-color: transparent; |
||||
|
border-color: #ffffff; |
||||
|
&::before { |
||||
|
background-color: #ffffff; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
.logo { |
||||
|
width: 100%; |
||||
|
} |
||||
|
.name { |
||||
|
position: absolute; |
||||
|
top: 12%; |
||||
|
left: 0; |
||||
|
width: 100%; |
||||
|
font-size: 36px; |
||||
|
line-height: 40px; |
||||
|
color: #fff; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.m-footer { |
||||
|
position: absolute; |
||||
|
bottom: 0; |
||||
|
left: 0; |
||||
|
right: 0; |
||||
|
padding: 20px; |
||||
|
color: rgba(255, 255, 255, 0.6); |
||||
|
text-align: center; |
||||
|
p { |
||||
|
margin: 10px 0; |
||||
|
} |
||||
|
a { |
||||
|
padding: 0 5px; |
||||
|
color: rgba(255, 255, 255, 0.6); |
||||
|
&:focus, |
||||
|
&:hover { |
||||
|
color: #fff; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
@ -0,0 +1,209 @@ |
|||||
|
<template> |
||||
|
<fixed1920> |
||||
|
<div class="g-cnt"> |
||||
|
<div class="m-top animate__animated menu animate__fadeInDown"> |
||||
|
<img class="logo" src="@/assets/img/yantai/index/db.png" /> |
||||
|
<div class="name">智慧社区平台</div> |
||||
|
</div> |
||||
|
|
||||
|
<div class="m-list"> |
||||
|
<div class="list"> |
||||
|
<div class="animate__animated menu animate__fadeInLeft"> |
||||
|
<img |
||||
|
class="menu-bg" |
||||
|
src="@/assets/img/yantai/index/yuanhu-you.png" |
||||
|
/> |
||||
|
<div class="menu-list"> |
||||
|
<div class="menu-item z-zuo" @click="toPage('/main/base-resi')"> |
||||
|
人房信息 |
||||
|
</div> |
||||
|
<div |
||||
|
class="menu-item z-zuo" |
||||
|
@click="toPage('/main/base-epidemic-antiInfo')" |
||||
|
> |
||||
|
疫情防控 |
||||
|
</div> |
||||
|
<div |
||||
|
class="menu-item z-zuo" |
||||
|
@click="toPage('/main/shequzhili-event-eventList')" |
||||
|
> |
||||
|
社区治理 |
||||
|
</div> |
||||
|
<div |
||||
|
class="menu-item z-zuo z-on" |
||||
|
@click="toPage('/main/communityParty-members-index')" |
||||
|
> |
||||
|
社区党建 |
||||
|
</div> |
||||
|
<div |
||||
|
class="menu-item z-zuo" |
||||
|
@click="toPage('/main/communityService-measure-index')" |
||||
|
> |
||||
|
社区服务 |
||||
|
</div> |
||||
|
<div class="menu-item z-zuo" @click="toPage('/main/workPc-guidance-guidanceList.vue')">便携工具</div> |
||||
|
<div class="menu-item z-zuo" @click="toPage('/main/workSys-mapConfig')">系统管理</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
|
||||
|
<img class="arrow" src="@/assets/img/yantai/index/zuo.png" /> |
||||
|
|
||||
|
<div |
||||
|
class="item animate__animated animate__pulse" |
||||
|
@click="handleClickItem(1)" |
||||
|
> |
||||
|
<div class="item-wrap"> |
||||
|
<img class="logo" src="@/assets/img/yantai/index/guanli.png" /> |
||||
|
<div class="name">管理平台</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
|
||||
|
<div |
||||
|
class="item animate__animated animate__pulse" |
||||
|
@click="handleClickItem(2)" |
||||
|
> |
||||
|
<div class="item-wrap"> |
||||
|
<img class="logo" src="@/assets/img/yantai/index/shuju.png" /> |
||||
|
<div class="name">数据分析平台</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
|
||||
|
<img class="arrow" src="@/assets/img/yantai/index/you.png" /> |
||||
|
|
||||
|
<div class="menu animate__animated menu animate__fadeInRight"> |
||||
|
<img |
||||
|
class="menu-bg" |
||||
|
src="@/assets/img/yantai/index/yuanhu-zuo.png" |
||||
|
/> |
||||
|
<div class="menu-list"> |
||||
|
<div |
||||
|
class="menu-item z-you" |
||||
|
@click="toPage('/main-shuju/visual-basicinfo-basicInfoMain')" |
||||
|
> |
||||
|
基础信息 |
||||
|
</div> |
||||
|
<div |
||||
|
class="menu-item z-you" |
||||
|
@click="toPage('/main-shuju/visual-warning-index')" |
||||
|
> |
||||
|
人员预警 |
||||
|
</div> |
||||
|
<div |
||||
|
class="menu-item z-you" |
||||
|
@click="toPage('/main-shuju/visual-measure-service')" |
||||
|
> |
||||
|
需求清单 |
||||
|
</div> |
||||
|
<div |
||||
|
class="menu-item z-you z-on" |
||||
|
@click="toPage('/main-shuju/visual-communityParty-party')" |
||||
|
> |
||||
|
社区党建 |
||||
|
</div> |
||||
|
<div |
||||
|
class="menu-item z-you" |
||||
|
@click=" |
||||
|
toPage( |
||||
|
'/main-shuju/visual-communityGovern-shijianchuli-shijianchulifenxi' |
||||
|
) |
||||
|
" |
||||
|
> |
||||
|
社区治理 |
||||
|
</div> |
||||
|
<div |
||||
|
class="menu-item z-you" |
||||
|
@click="toPage('/main-shuju/visual-heart-index')" |
||||
|
> |
||||
|
初心互助 |
||||
|
</div> |
||||
|
<div class="menu-item z-you" @click="toPage('/main-shuju/i-1536625421829599234')"> |
||||
|
三维展示 |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
<div class="m-footer"> |
||||
|
<div class="login-footer"> |
||||
|
<p> |
||||
|
<!-- <a href="http://www.elinkchina.com.cn/" target="_blank">{{ |
||||
|
$t("login.copyright") |
||||
|
}}</a> --> |
||||
|
</p> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
</fixed1920> |
||||
|
</template> |
||||
|
<script> |
||||
|
import { messages } from "@/i18n"; |
||||
|
import fixed1920 from "@/views/components/fixed1920.vue"; |
||||
|
|
||||
|
export default { |
||||
|
data() { |
||||
|
return { |
||||
|
pubKey: null, // 获取到公钥 |
||||
|
isShowLogin: true, |
||||
|
i18nMessages: messages, |
||||
|
}; |
||||
|
}, |
||||
|
|
||||
|
components: { fixed1920 }, |
||||
|
computed: { |
||||
|
bdStyle() { |
||||
|
console.log("clientHeight", document.documentElement.clientHeight); |
||||
|
const scale = document.documentElement.clientWidth / 1920; |
||||
|
const height = document.documentElement.clientHeight / scale; |
||||
|
const top = (document.documentElement.clientHeight - height) / 2; |
||||
|
const left = (document.documentElement.clientWidth - 1920) / 2; |
||||
|
return { |
||||
|
transform: `scale(${scale})`, |
||||
|
height: `${height}px`, |
||||
|
left: `${left}px`, |
||||
|
top: `${top}px`, |
||||
|
}; |
||||
|
}, |
||||
|
}, |
||||
|
created() {}, |
||||
|
mounted() {}, |
||||
|
|
||||
|
methods: { |
||||
|
handleClickItem(k) { |
||||
|
if (k == 1) { |
||||
|
this.$router.replace({ name: "main" }); |
||||
|
} else if (k == 2) { |
||||
|
this.$router.replace({ name: "main-shuju" }); |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
toPage(path) { |
||||
|
this.$router.push({ path }); |
||||
|
}, |
||||
|
|
||||
|
// 平阴联动 自动登录接口 |
||||
|
getAutoLogin(platformToken) { |
||||
|
this.dataForm.thirdToken = platformToken; |
||||
|
this.dataForm.platform = "pyld"; |
||||
|
this.$http |
||||
|
.post(`/auth/sso/oper/third/login`, this.dataForm) |
||||
|
.then(({ data: res }) => { |
||||
|
if (res.code !== 0) { |
||||
|
if (res.code == 8302) { |
||||
|
return this.$message.error(res.msg); |
||||
|
} |
||||
|
return this.$message.error(res.msg); |
||||
|
} |
||||
|
localStorage.setItem("customerId", res.data.customerId); |
||||
|
localStorage.setItem("userType", "work"); |
||||
|
localStorage.setItem("showHeader", "0"); |
||||
|
localStorage.setItem("token", res.data.token); |
||||
|
this.$router.replace({ name: "home" }); |
||||
|
}) |
||||
|
.catch(() => {}); |
||||
|
// epmet-ext9.elinkservice.cn/platform-admin |
||||
|
}, |
||||
|
}, |
||||
|
}; |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss" src="@/assets/scss/pages/yantai-index.scss" scoped></style> |
||||
Loading…
Reference in new issue