Skip to content

Y
yibao
Commit c491ddf5 authored by 张红's avatar 张红
Browse files
Options

隐藏代缴

parent 1f4f1017
Hide whitespace changes
Inline Side-by-side
Showing with 207 additions and 210 deletions
src/pages/index/index.vue
View file @ c491ddf5
<template> <template>
<view class="container"> <view class="container">
<view class="header"> <view class="header">
<h1>医疗保障服务</h1> <h1>医疗保障服务</h1>
<view class="service-list u-flex"> <view class="service-list u-flex">
<view class="service-item u-flex u-flex-items-center"> <view class="service-item u-flex u-flex-items-center">
<image src="@/static/images/gou.png"></image> <image src="@/static/images/gou.png"></image>
便捷服务 便捷服务
</view> </view>
<view class="service-item u-flex u-flex-items-center"> <view class="service-item u-flex u-flex-items-center">
<image src="@/static/images/gou.png"></image> <image src="@/static/images/gou.png"></image>
安全放心 安全放心
</view> </view>
<view class="service-item u-flex u-flex-items-center"> <view class="service-item u-flex u-flex-items-center">
<image src="@/static/images/gou.png"></image> <image src="@/static/images/gou.png"></image>
服务查询 服务查询
</view> </view>
</view> </view>
</view> </view>
<view class="content-wrap"> <view class="content-wrap">
<view class="content" v-for="(item, index) in list" :key="index"> <view class="content" v-for="(item, index) in list" :key="index">
<view class="title u-flex u-flex-between u-flex-items-center"> <view class="title u-flex u-flex-between u-flex-items-center">
<text>{{ item.title }}</text> <text>{{ item.title }}</text>
<image src="@/static/images/icon1.png" v-if="index == 0"></image> <image src="@/static/images/icon1.png" v-if="index == 0"></image>
<image src="@/static/images/icon2.png" v-if="index == 1"></image> <image src="@/static/images/icon2.png" v-if="index == 1"></image>
<image src="@/static/images/icon3.png" v-if="index == 2"></image> <image src="@/static/images/icon3.png" v-if="index == 2"></image>
</view> </view>
<view class="list"> <view class="list">
<view class="list-item u-flex u-flex-between u-flex-items-center" <view class="list-item u-flex u-flex-between u-flex-items-center" v-for="(items, key) in item.list" :key="key" @click="go(items.link)">
v-for="(items, key) in item.list" :key="key" <text>{{ items.name }}</text>
@click="go(items.link)"> <image src="@/static/images/arrow.png"></image>
<text>{{ items.name }}</text> </view>
<image src="@/static/images/arrow.png"></image> </view>
</view> </view>
</view> </view>
</view> </view>
</view>
</view>
</template> </template>
<script lang="ts"> <script lang="ts">
import Vue from 'vue'; import Vue from 'vue'
export default Vue.extend({ export default Vue.extend({
data() { data() {
return { return {
list: [ list: [
{ {
title: '医保个人账户代缴服务', title: '医保个人账户代缴服务',
// icon: icon1, // icon: icon1,
list: [ list: [
{ // {
name: '医保个人账户代缴', // name: '医保个人账户代缴',
link: '/pages/payFee/payFee' // link: '/pages/payFee/payFee'
}, // },
{ {
name: '医保个人账户代缴金额查询', name: '医保个人账户代缴金额查询',
link: '/pages/payFee/moneySearch' link: '/pages/payFee/moneySearch'
}, },
{ {
name: '医保个人账户代缴记录查询', name: '医保个人账户代缴记录查询',
link: '/pages/payFee/payFeeSearch' link: '/pages/payFee/payFeeSearch'
} }
] ]
}, },
{ {
title: '医保查询服务', title: '医保查询服务',
// icon: icon2, // icon: icon2,
list: [ list: [
{ {
name: '定点药店信息查询', name: '定点药店信息查询',
link: '/pages/pharmacy/search' link: '/pages/pharmacy/search'
}, },
{ {
name: '定点医疗机构信息查询', name: '定点医疗机构信息查询',
link: '/pages/hospital/search' link: '/pages/hospital/search'
}, },
{ {
name: '个税大病专项扣除信息', name: '个税大病专项扣除信息',
link: '/pages/personalIncomeTax/search' link: '/pages/personalIncomeTax/search'
}, },
{ {
name: '经办机构信息查询', name: '经办机构信息查询',
link: '/pages/handlingAgency/search' link: '/pages/handlingAgency/search'
}, },
{ {
name: '居民缴费进度查询', name: '居民缴费进度查询',
link: '/pages/residentPaymentProgress/search' link: '/pages/residentPaymentProgress/search'
}, },
{ {
name: '慢病认定医院查询', name: '慢病认定医院查询',
link: '/pages/chronicDiseaseIdentification/search' link: '/pages/chronicDiseaseIdentification/search'
}, },
{ {
name: '门诊统筹使用查询', name: '门诊统筹使用查询',
link: '/pages/outpatientCoordination/search' link: '/pages/outpatientCoordination/search'
} }
] ]
}, },
{ {
title: '其他查询服务', title: '其他查询服务',
// icon: icon1, // icon: icon1,
list: [ list: [
{ {
name: '转移信息查询', name: '转移信息查询',
link: '/pages/relationshipTransfer/search' link: '/pages/relationshipTransfer/search'
}, },
{ {
name: '药品目录信息查询', name: '药品目录信息查询',
link: '/pages/drug/search' link: '/pages/drug/search'
}, },
{ {
name: '医保年度账单查询', name: '医保年度账单查询',
link: '/pages/bill/search' link: '/pages/bill/search'
}, },
{ {
name: '医疗救助资格信息查询', name: '医疗救助资格信息查询',
link: '/pages/succour/search' link: '/pages/succour/search'
}, },
{ {
name: '已开通门诊统筹药店查询', name: '已开通门诊统筹药店查询',
link: '/pages/outpatientCoordinationPharmacy/search' link: '/pages/outpatientCoordinationPharmacy/search'
}, },
{ {
name: '职工缴费信息查询', name: '职工缴费信息查询',
link: '/pages/employeePaymentProgress/search' link: '/pages/employeePaymentProgress/search'
} }
] ]
} }
]
] }
} },
}, onLoad() {},
onLoad() {}, methods: {
methods: { go(url: string) {
go(url: string) { xma.navigateTo({
xma.navigateTo({ url
url, })
}) }
} }
}, })
});
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.container { .container {
padding-bottom: 20rpx; padding-bottom: 20rpx;
background: #F2F3F7; background: #f2f3f7;
} }
.header { .header {
width: 100%; width: 100%;
height: 337rpx; height: 337rpx;
padding: 33rpx 40rpx; padding: 33rpx 40rpx;
background: url(@/static/images/bg.png) no-repeat 0 0; background: url(@/static/images/bg.png) no-repeat 0 0;
background-size: 100% 100%; background-size: 100% 100%;
h1 { h1 {
margin-bottom: 15rpx; margin-bottom: 15rpx;
font-size: 56rpx; font-size: 56rpx;
line-height: 81rpx; line-height: 81rpx;
font-weight: 500; font-weight: 500;
color: #0E2F63; color: #0e2f63;
} }
.service-item { .service-item {
margin-right: 36rpx; margin-right: 36rpx;
font-size: 24rpx; font-size: 24rpx;
color: #466184; color: #466184;
line-height: 35rpx; line-height: 35rpx;
image { image {
margin-right: 10rpx; margin-right: 10rpx;
width: 24rpx; width: 24rpx;
height: 24rpx; height: 24rpx;
} }
} }
} }
.content-wrap { .content-wrap {
position: relative; position: relative;
padding: 0 24rpx; padding: 0 24rpx;
margin-top: -140rpx; margin-top: -140rpx;
.content { .content {
margin-bottom: 24rpx; margin-bottom: 24rpx;
width: 100%; width: 100%;
padding: 24rpx 18rpx; padding: 24rpx 18rpx;
background: linear-gradient( 180deg, #FFE2EA 8%, #F9F0F3 100%); background: linear-gradient(180deg, #ffe2ea 8%, #f9f0f3 100%);
border-radius: 24rpx 24rpx 24rpx 24rpx; border-radius: 24rpx 24rpx 24rpx 24rpx;
border: 4rpx solid #FFFFFF; border: 4rpx solid #ffffff;
&:nth-child(2) { &:nth-child(2) {
background: linear-gradient( 180deg, #D6E8FF 9%, #E5F0FF 99%); background: linear-gradient(180deg, #d6e8ff 9%, #e5f0ff 99%);
} }
&:nth-child(3) { &:nth-child(3) {
background: linear-gradient( 180deg, #FFF0D5 0%, #FFF8EC 100%); background: linear-gradient(180deg, #fff0d5 0%, #fff8ec 100%);
} }
} }
.title { .title {
padding: 6rpx 0 24rpx 10rpx; padding: 6rpx 0 24rpx 10rpx;
font-weight: 500; font-weight: 500;
font-size: 36rpx; font-size: 36rpx;
color: #3D3D3D; color: #3d3d3d;
image { image {
width: 80rpx; width: 80rpx;
height: 80rpx; height: 80rpx;
} }
} }
.list { .list {
padding: 0 10rpx; padding: 0 10rpx;
background: #fff; background: #fff;
border-radius: 24rpx 24rpx 24rpx 24rpx; border-radius: 24rpx 24rpx 24rpx 24rpx;
} }
.list-item { .list-item {
padding: 30rpx 10rpx; padding: 30rpx 10rpx;
font-weight: 400; font-weight: 400;
font-size: 30rpx; font-size: 30rpx;
color: #3D3D3D; color: #3d3d3d;
image { image {
width: 13rpx; width: 13rpx;
height: 24rpx; height: 24rpx;
} }
} }
} }
</style> </style>
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