<template>
  <view id="page">
    <view class="Width100 Box BorderBox">
      <view class="Content MarginAuto BorderBox">
        <view class="List Width100 BorderBox">
          <view 
		    class="Unit FontBold Flex BorderBox Flex_C_S-B Width100 MarginT_30rpx BG_FFFFFF BorderR_30rpx" 
			v-for="item in funcList" :key='item.id'
			@click='handleClick(item)'
		  >
            <view class="title">
            	{{ item.title }}
            </view>
			<u-icon name="arrow-right" color="#605F74" size="20"></u-icon>
          </view>
		  <view @click="logout" class="Unit FontBold BorderBox TextCenter Width100 MarginT_30rpx BorderR_30rpx logout">
		    退出登录
		  </view>
        </view>
      </view>
    </view>
  </view>
</template>

<script>
import GlobalToast from "../../components/globalToast";
export default {
  // 组件
  components: {GlobalToast},
  data() {
    return {
      // 公用的js
      $: this.$,
      bgUrl1:'', // 登录信息背景图
	  funcList: [
		  { id:1,title:'修改手机',url:'/pages/mine/changePhone' },
		  { id:2,title:'修改密码',url:'/pages/mine/changePassword' },
		  // { id:3,title:'关于航屹匠工',url:'/pages/mine/about' },
		  { id:4,title:'清空缓存',url:'clean' },
	  ]
    }
  },
  // 页面加载
  onLoad(e) {
  },
  // 页面显示
  onShow() {
    // 顶部背景图
    this.bgUrl1 = "background-image:url('" + this.$.imgSrc + "/scimg/bg1.png');background-repeat: no-repeat;background-position: center top;background-size:100% 472rpx;"
  },
  // 计算属性
  computed: {},
  // 方法
  methods: {
	  logout() {
		  this.$.clearData();
		  this.$.openNew('/pages/logIn/logIn');
	  },
    handleClick(row) {
	  switch (row.url){
	  	case 'clean':
		    uni.clearStorageSync();
		    uni.showToast({
		        title:'清除成功'
		    })
	  		break;
	  	default:
		this.$.open(row.url)
	  		break;
	  }
    },
    // 跳转页面
    skipPage(even){
      this.$.open(even)
    },
  },
  onReady() {
  },
  // 页面卸载
  onUnload() {

  },
  // 触发下拉刷新
  onPullDownRefresh() {
    // 延迟关闭刷新动画
    setTimeout(() => {
      uni.stopPullDownRefresh();
    }, 1500);
  },
  // 页面上拉触底事件的处理函数
  onReachBottom() {
  },
}
</script>

<style>
</style>
<style lang="scss" scoped>
page {
  background:#F6F8FA;
}
.Box{
  .Content{
    width: calc(100% - 64rpx);
    padding-bottom: 100rpx;
  }
  
  .Unit {
	  padding: 30rpx;
  }
  
  .logout {
	  background: #E1EDFF;
	  color: #0064FF;
  }
}
</style>
