<template>
  <view class="app-container">
    <u-navbar
      leftText="返回"
      title="安全生产监督"
      :autoBack="true"
      :placeholder="true"
    />
    <view class="codes-cell view-global" @click="handelCode()">
      <image src="/static/images/code.png" class="codes-icon" mode=""></image>
      <text class="codes-title">扫描商家二维码</text>
    </view>

    <view class="cell-list">
      <view
        class="cell-item view-global"
        v-for="(item, index) in cellList"
        @click="handelPath(item.path)"
        :style="{
          color: index == 0 ? '#C06E37' : index == 1 ? '#6664BE' : '#6682A4',
        }"
        :key="index"
        :class="'cell' + index"
      >
        {{ item.name }}
      </view>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      cellList: [
        {
          name: "现场检查",
          path: "/subViolation/ShengchanJiandu/FieldTest/FieldTest",
        },
        {
          name: "整改工单",
          path: "/subViolation/ShengchanJiandu/WorkOrder/WorkOrder",
        },
        {
          name: "信息发布",
          path: "/subViolation/ShengchanJiandu/MsgIssue/MsgIssue",
        },
      ],
    };
  },
  methods: {
    //扫码
    handelCode() {
      // // #ifdef H5
      // uni.showToast({
      // 	title: 'H5暂不支持扫码',
      // 	icon: 'none'
      // })
      // return
      // // #endif
      // uni.scanCode({
      // success: () => {
      uni.$u.route({
        url: "/subViolation/ShengchanJiandu/CodesInfo",
      });

      // 	}
      // })
    },
    handelPath(path) {
      uni.$u.route({
        url: path,
      });
    },
  },
};
</script>

<style lang="scss" scoped>
.app-container {
  padding: 40rpx 20rpx 20rpx 20rpx;

  .codes-cell {
    height: 118rpx;
    background: linear-gradient(180deg, #7cadff 0%, #367bef 100%);
    border-radius: 16rpx;
    display: flex;
    align-items: center;
    justify-content: center;

    .codes-icon {
      height: 72rpx;
      width: 72rpx;
      margin-right: 50rpx;
    }

    .codes-title {
      font-size: 40rpx;
      font-weight: bold;
      color: #ffffff;
    }
  }

  .cell-list {
    margin-top: 45rpx;

    & > .cell-item {
      height: 176rpx;
      line-height: 176rpx;
      font-size: 38rpx;
      font-weight: bold;
      box-sizing: border-box;
      padding-left: 70rpx;
      border-radius: 16rpx;
      background-size: 100% 100%;
      margin-bottom: 30rpx;
    }
  }
}

.cell0 {
  background: url("@/static/images/cell0.png");
}

.cell1 {
  background: url("@/static/images/cell1.png");
}

.cell2 {
  background: url("@/static/images/cell2.png");
}
</style>
