<!-- 										服务设置页												 -->
<template style="background-color: #f6f6f6;">
	<view style="width: 100%;height: 100%;">
		<!-- 更多设置 -->
		<view style="height: 80rpx;width: 100%;display: flex;justify-content: flex-end;align-items: center;padding: 0 20rpx;">
			<text style="color: #757575;margin-right: 20rpx;" @click="next">更多设置</text>
			<u-icon name="arrow-right" color="#c9c9c9" @click="next"></u-icon>
		</view>
		<!-- 开关选择器 -->
		<view v-for="(item,index) in serbicelist" class="list">
			<!-- 左边文字 -->
			<view style="width: 20%;">{{item.zhonglei}}</view>
			<!-- 开通状态 -->
			<view style="width: 40%;">
				<text v-if="item.Opening" style="text-decoration: underline; color: #888888;">未开通</text>
			</view>
			<!-- 服务状态 -->
			<view style="width: 20%;color: #999999;">
				<text v-if="item.state">服务开启</text>
				<text v-else>服务关闭</text>
			</view>
			<!-- 控制器 -->
			<view style="width: 15%;">
			<u-switch v-model="item.state" active-color="#84bb43" inactive-color="#eee" :disabled="item.Opening"></u-switch>
			</view>
			
		</view>
	</view>
</template>

<script>
	export default {
		components: {

		},
		onLoad() {

		},
		mounted() {

		},
		data() {
			return {
				//zhonglei咨询种类
				//state服务开启状态 true为开 false为关
				//Opening开通状态 false为开通
				serbicelist: [{
					zhonglei: '电话咨询',
					state: false,
					Opening: false
				}, {
					zhonglei: '图文咨询',
					state: false,
					Opening: true
				}, {
					zhonglei: '门诊预约',
					state: false,
					Opening: false
				}]
			}
		},
		methods: {
			// 下一页
			next(){
				uni.navigateTo({
					url:'/pages/service/more'
				})
			}

		}
	};
</script>

<style>
	.list {
		height: 120rpx;
		width: 100%;
		padding: 0 20rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		background-color: #FFFFFF;
		border-bottom:1rpx solid #f6f6f6;
	}
</style>
