<template>
  <view class="pages-box">
    <uv-navbar autoBack title="模式管理" placeholder />
    <view class="pattern-hint">*说明：积分直接到账，补贴额需要排队</view>
    <template v-for="item in RowsList">
      <PatternItem :item="item" @edit="openEditPattern(item)" />
    </template>

    <template v-if="LoadStatus && LoadStatus !== 'loading' && !RowsList.length">
      <noData />
    </template>

    <template v-else-if="LoadStatus">
      <uv-load-more :status="LoadStatus" line />
    </template>

    <view class="footer-box">
      <view class="footer-btn" @click.stop="openEditPattern()"> 新增模式 </view>
      <view class="footer-btn" @click.stop="openPatternConfig()">
        配置条件
      </view>
    </view>
    <view class="footer-placeholder" />
  </view>
</template>

<script lang="ts" setup>
import { getSubsidyModePageApi } from "@/api/ShopContent.ts";
import PatternItem from "./components/PatternItem.vue";
import { usePageData } from "@/hooks/usePageData.ts";
const { RowsList, LoadStatus, initData, Total } = usePageData(getSubsidyModePageApi);

initData();

const openEditPattern = (item: any) => {
  uni.navigateTo({
    url: `/pages/shop/setting/EditPattern?index=${Total.value + 1 + '.0'}&modeId=${
      item ? item.modeId || "" : ""
    }`,
    events: {
      updateData: (data: any) => {
        initData();
      },
    },
  });
};
const openPatternConfig = () => {
  uni.navigateTo({
    url: "/pages/shop/setting/PatternConfig",
  });
};
</script>

<style lang="scss" scoped>
.pattern-hint {
  width: 100%;
  height: 100rpx;
  padding: 0 30rpx;
  font-size: 28rpx;
  font-family: PingFang SC, PingFang SC-Regular;
  font-weight: 400;
  color: #ff0000;
  line-height: 100rpx;
  // position: fixed;
  // left: 0;
  // right: 0;
}

:deep(.pattern-item) {
  margin-bottom: 20rpx;
}

.footer-placeholder {
  width: 100%;
  height: 145rpx;
}

.footer-box {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  height: 145rpx;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #ffffff;

  .footer-btn {
    width: 314rpx;
    height: 90rpx;
    background: #eb5153;
    border-radius: 45rpx;
    font-size: 32rpx;
    font-family: PingFang SC, PingFang SC-Regular;
    font-weight: 400;
    text-align: center;
    color: #ffffff;
    line-height: 90rpx;

    & + .footer-btn {
      margin-left: 14rpx;
      background-color: #ffb300;
    }
  }
}
</style>
