<template>
  <view class="px-base">
    <CuNavbar title="数据上报"></CuNavbar>
    <view class="mt-30rpx">
      <uv-form
        labelWidth="140rpx"
        labelPosition="left"
        :borderBottom="false"
        :model="form"
        :rules="rules"
        errorType="toast"
        ref="formRef"
      >
        <view class="space-y-15rpx">
          <view class="card-shadow bg-white rounded-19rpx px-base">
            <uv-form-item label="日期">
              <view class="w-full">
                {{ form.date }}
              </view>
            </uv-form-item>
          </view>

          <view> </view>

          <view class="card-shadow bg-white rounded-19rpx px-base">
            <uv-form-item>
              <TitleComp title="电彩" textSize="32rpx"></TitleComp>
            </uv-form-item>
            <uv-form-item label="销售" borderBottom>
              <uv-input
                border="none"
                placeholder="请输入电彩销售金额"
              ></uv-input>
            </uv-form-item>
            <uv-form-item label="兑奖">
              <uv-input
                border="none"
                placeholder="请输入电彩兑奖金额"
              ></uv-input>
            </uv-form-item>
          </view>

          <view class="card-shadow bg-white rounded-19rpx px-base">
            <uv-form-item>
              <TitleComp title="汇总情况" textSize="32rpx"></TitleComp>
            </uv-form-item>
            <uv-form-item label="销售合计" borderBottom>
              <uv-input
                border="none"
                placeholder="请输入总帐销售金额"
              ></uv-input>
            </uv-form-item>
            <uv-form-item label="兑奖合计" borderBottom>
              <uv-input
                border="none"
                placeholder="请输入总帐兑奖金额"
              ></uv-input>
            </uv-form-item>
            <uv-form-item label="新增客户" borderBottom>
              <uv-input
                border="none"
                placeholder="请输入微信新增人数"
              ></uv-input>
            </uv-form-item>
            <uv-form-item label="交账金额" borderBottom>
              <uv-input border="none" placeholder="请输入交账金额"></uv-input>
            </uv-form-item>
            <view class="text-primary text-xs mt-10rpx pb-base"
              >*请确保填写的交账金额正确无误</view
            >
          </view>

          <view class="card-shadow bg-white rounded-19rpx px-base pb-base">
            <uv-form-item>
              <view class="w-full">
                <TitleComp title="时段报表照片" textSize="32rpx">
                  <template #right>
                    <view class="text-hex-999999"> 0/9 </view>
                  </template>
                </TitleComp>
              </view>
            </uv-form-item>
            <uv-form-item>
              <uv-upload></uv-upload>
            </uv-form-item>
            <view class="text-primary text-xs">
              *竞彩时段报表照片，玩法时段报表照片，每日账本上传（需亲笔签字），销量本上传
            </view>
          </view>
        </view>
      </uv-form>
    </view>

    <uv-datetime-picker ref="datetimePicker" v-model="form.date" mode="date">
    </uv-datetime-picker>
  </view>
</template>
<script setup>
import CuNavbar from '@/components/cu-navbar/index'
import TitleComp from '@/components/title-comp/index'
import { ref, reactive } from 'vue'
const formRef = ref(null)
const datetimePicker = ref(null)
const form = reactive({
  date: '2022-01-01',
})
const rules = reactive({})
</script>
