<template>
  <view>
    <meet-sticky :bg="bg">
      <meet-navbar title="帮助文档" :isFixed="false"></meet-navbar>
    </meet-sticky>
    <view class="container">
      <view class="title"> 问题反馈 </view>
      <view class="content">
        <u-collapse accordion>
          <u-collapse-item
            :title="item.title"
            v-for="(item, index) in docList"
            :key="index"
          >
            <view class="collapse-item">
              <view v-for="(t, i) in item.explain" :key="i">
                <view>{{ t }}</view>
              </view>
            </view>
          </u-collapse-item>
        </u-collapse>
      </view>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      docList: [
        {
          title: "1.文字处理时间",
          explain: ["11111111111", "222222222222"],
        },
        {
          title: "2.支持的语言",
          explain: ["11111111111", "222222222222"],
        },
      ],
    };
  },
};
</script>

<style lang="scss" scoped>
.collapse-item {
  background: #ffffff;
  border-radius: 16rpx 16rpx 16rpx 16rpx;
  padding: 20rpx;
  line-height: 1.8;
}
.content {
  background: #f4f7ff;
  border-radius: 24rpx 24rpx 24rpx 24rpx;
  border: 2rpx solid #ffffff;
  flex: 1;
}
.container {
  padding: 24rpx;
  height: 85vh;
  display: flex;
  flex-direction: column;
}
.u-page {
  padding: 0;

  &__item {
    &__title {
      color: $u-tips-color;
      background-color: $u-bg-color;
      padding: 15px;
      font-size: 15px;

      &__slot-title {
        color: $u-primary;
        font-size: 14px;
      }
    }
  }
}
.title {
  font-weight: 700;
  font-size: 32rpx;
  color: #23262b;
  margin-bottom: 24rpx;
}
.u-collapse-content {
  color: $u-tips-color;
  font-size: 14px;
}
::v-deep .u-line {
  border-bottom-style: none !important;
}
</style>