init
This commit is contained in:
Paidax
@@ -0,0 +1,184 @@
|
||||
<!--#
|
||||
layout("/mobile/platform.html"){
|
||||
#-->
|
||||
<style>
|
||||
|
||||
#app {
|
||||
background-color: #FFFFFF;
|
||||
}
|
||||
|
||||
.icon_text {
|
||||
font-size: 12px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.van-image {
|
||||
max-height: 300px !important;
|
||||
}
|
||||
|
||||
.not_open {
|
||||
filter: grayscale(100%);
|
||||
}
|
||||
|
||||
.van-doc-card {
|
||||
margin: 14px;
|
||||
padding: 12px 38px;
|
||||
background-color: #fff;
|
||||
border-radius: 10px;
|
||||
box-shadow: 0 8px 12px #ebedf0;
|
||||
line-height: 36px;
|
||||
font-size: 13px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.number_text {
|
||||
font-size: 36px;
|
||||
color: #409eff;
|
||||
}
|
||||
|
||||
.van-empty__description {
|
||||
font-size: 18px;
|
||||
line-height: 40px;
|
||||
}
|
||||
|
||||
.title {
|
||||
text-align: center;
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
.van-info--dot {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
<div id="app" v-cloak>
|
||||
|
||||
<div v-if="active === 0" style="background-color: #f6f7f9; min-height: 100vh">
|
||||
<van-notice-bar
|
||||
left-icon="volume-o" color="#1989fa" background="#ecf9ff"
|
||||
text="温馨提示：只显示当前年份的待办事项"
|
||||
></van-notice-bar>
|
||||
<div @click="toUrl(o)" class="van-doc-card" v-for="o in needItems">
|
||||
<div class="title">{{ o.title }}</div>
|
||||
<div style="display: flex; align-items: center; justify-content: space-between;">
|
||||
<div>
|
||||
<div style="color: grey; font-size: 15px">{{ o.label }}</div>
|
||||
</div>
|
||||
<div class="number_text">
|
||||
<span>{{ o.number }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<van-empty
|
||||
v-if="needItems.length === 0"
|
||||
class="custom-image"
|
||||
image="https://img01.yzcdn.cn/vant/custom-empty-image.png"
|
||||
description="暂无待办"
|
||||
></van-empty>
|
||||
</div>
|
||||
|
||||
<div v-if="active === 1">
|
||||
<!--轮播图-->
|
||||
<van-swipe class="my-swipe" :autoplay="2000" indicator-color="white">
|
||||
<van-swipe-item v-for="item in photoArray">
|
||||
<van-image width="100%" :height="$(document).height() * 0.26"
|
||||
:src="item.src"></van-image>
|
||||
</van-swipe-item>
|
||||
</van-swipe>
|
||||
|
||||
<!--宫格-->
|
||||
<van-grid :column-num="3" :border="false">
|
||||
|
||||
<van-grid-item v-for="item in gridArray" :class="item.isOpen ? '' : 'not_open'"
|
||||
:url="item.isOpen ? '/mobile/index/toHome?type=' + item.text : ''">
|
||||
<van-image width="48" height="48" :src="item.src"></van-image>
|
||||
<span class="icon_text">{{item.text}}</span>
|
||||
</van-grid-item>
|
||||
|
||||
<van-grid-item>
|
||||
<image src="/assets/mobile/svg/qxbd.svg" @click="loginOut" width="48" height="48"></image>
|
||||
<span class="icon_text">解除绑定</span>
|
||||
</van-grid-item>
|
||||
</van-grid>
|
||||
</div>
|
||||
|
||||
<van-tabbar v-model="active" @change="tabbrChange">
|
||||
<van-tabbar-item :dot="needCount" icon="envelop-o">待办</van-tabbar-item>
|
||||
<van-tabbar-item icon="home-o">工作台</van-tabbar-item>
|
||||
</van-tabbar>
|
||||
|
||||
</div>
|
||||
|
||||
<script>
|
||||
const vue = new Vue({
|
||||
el: '#app',
|
||||
data() {
|
||||
return {
|
||||
active: 1,
|
||||
needCount: 0,
|
||||
needItems: [],
|
||||
photoArray: [
|
||||
{src: '/assets/mobile/img/home/home1.png'},
|
||||
{src: '/assets/mobile/img/home/home2.png'},
|
||||
{src: '/assets/mobile/img/home/home3.png'},
|
||||
],
|
||||
gridArray: [
|
||||
// {src: '/assets/mobile/img/home/8活动报名.jpg', text: '活动报名', isOpen: true,},
|
||||
{src: '/assets/mobile/img/home/7会员申请.jpg', text: '会员管理', isOpen: true,},
|
||||
{src: '/assets/mobile/img/home/9我的福利.jpg', text: '我的福利', isOpen: true,},
|
||||
{src: '/assets/mobile/img/home/1民主管理.jpg', text: '民主管理', isOpen: true,},
|
||||
{src: '/assets/mobile/img/home/6文体活动.jpg', text: '文体活动', isOpen: true,},
|
||||
{src: '/assets/mobile/img/home/3职工权益.jpg', text: '职工权益', isOpen: true,},
|
||||
{src: '/assets/mobile/img/home/2日常办公.jpg', text: '日常办公', isOpen: true,},
|
||||
// {src: '/assets/mobile/img/home/4教育培训.jpg', text: '教育培训', isOpen: true,},
|
||||
{src: '/assets/mobile/img/home/5校园文化.jpg', text: '校园文化', isOpen: true,},
|
||||
{src: '/assets/mobile/img/home/11女工计生.png', text: '女工计生', isOpen: true,},
|
||||
// {src: '/assets/mobile/img/home/10心理咨询.jpg', text: '法律援助', isOpen: true,},
|
||||
]
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
async loginOut() {
|
||||
const confirm = await vant.Dialog.confirm({
|
||||
title: '提示',
|
||||
message: '您确认要取消绑定吗？',
|
||||
})
|
||||
if (confirm === "confirm") {
|
||||
window.location.href = "/platform/login/logout"
|
||||
}
|
||||
},
|
||||
tabbrChange(o) {
|
||||
this.needItems = []
|
||||
this.initData()
|
||||
},
|
||||
toUrl(o) {
|
||||
location.href = o.url
|
||||
},
|
||||
/**
|
||||
* 入学登记待办
|
||||
* @returns {Promise<void>}
|
||||
*/
|
||||
async getRxdjAgenda() {
|
||||
const {data, code} = await $.get("/platform/rxdj/agent/getAgenda")
|
||||
if (code === 0) {
|
||||
this.needItems = this.needItems.concat(data.filter(v => v.number > 0))
|
||||
}
|
||||
},
|
||||
async initData() {
|
||||
await this.getRxdjAgenda()
|
||||
this.needCount = this.needItems.length
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.initData()
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
|
||||
|
||||
Reference in New Issue
Block a user