<template>
  <div class="set">
    <div class="info-content" @click="toSetList">
      <img src="./components/img/setting-icon.png" alt="" class="set-icon">
      <div class="info">
        <h2>配置事件类别</h2>
        <p>提交上报时选择事件类别，有助于管理上报和统计分析</p>
      </div>
      <img src="./components/img/right-icon.png" alt="" class="right-icon">
    </div>
  </div>
</template>

<script>
export default {
  props: {},
  data() {
    return {

    }
  },
  methods: {
    toSetList() {
      uni.navigateTo({url: './SetList'})
    }
  },
}
</script>

<style scoped lang="scss">
uni-page-body {
  height: 100%;
}
.set {
  height: 100%;
  padding: 32px 30px 0;
  box-sizing: border-box;
  background-color: #F3F7F8;
  .info-content{
    width: 100%;
    background-color: #fff;
    padding: 40px 8px 34px 40px;
    box-sizing: border-box;
    display: flex;
    .set-icon{
      width: 40px;
      height: 40px;
      margin-right: 44px;
    }
    .info{
      display: inline-block;
      width: calc(100% - 216px);
      h2{
        font-size: 36px;
        font-family: PingFangSC-Regular, PingFang SC;
        color: #333;
        line-height: 48px;
        margin-bottom: 6px;
      }
      p{
        width: 100%;
        font-size: 28px;
        font-family: PingFangSC-Regular, PingFang SC;
        color: #999;
        line-height: 40px;
        word-break: break-all;
      }
    }
    .right-icon{
      width: 56px;
      height: 56px;
      margin-left: 76px;
    }
  }
}
</style>
