<template>
  <page-layout>

    <template #header-right>
      <q-btn flat dense to="/cooperate/apply/history">申请记录</q-btn>
    </template>
    <q-form ref="formRef" @submit="submit">
      <q-list class="bg-white q-mt-sm" separator>
        <q-item class="items-start">
          <q-item-section class="q-pt-sm  q-mt-xs col-4">
            <q-item-label>对方店铺编号</q-item-label>
          </q-item-section>
          <q-item-section>
            <q-input v-model="form.shop_sn"
              :rules="[Rules.required]"
              borderless
              dense
              clearable
              hide-bottom-space
              placeholder="请填写对方店铺编号"/>
          </q-item-section>
        </q-item>
        <q-item class="items-start">
          <q-item-section class="q-pt-sm  q-mt-xs col-4">
            <q-item-label>合作店铺名称</q-item-label>
          </q-item-section>
          <q-item-section>
            <q-input v-model="form.shop_name"
              :rules="[Rules.required]"
              borderless
              clearable
              dense
              hide-bottom-space
              placeholder="请填写合作店铺名称"/>
          </q-item-section>
        </q-item>
        <q-item class="items-start">
          <q-item-section class="q-pt-sm  q-mt-xs col-4">
            <q-item-label>申请说明</q-item-label>
          </q-item-section>
          <q-item-section>
            <q-input v-model="form.apply_message"
              type="textarea"
              borderless
              clearable
              dense
              hide-bottom-space
              placeholder="请填写申请说明（选填）"/>
          </q-item-section>
        </q-item>
      </q-list>
      <div class="q-ma-md">
        <q-btn unelevated color="primary" class="fit" type="submit">申请</q-btn>
      </div>
      <p class="q-ma-md text-caption text-grey">

        <q-icon name="o_info"></q-icon>合作期间，在确保合作店铺真实性的同时，需及时监督出票方上传真实的票据，提醒对方按时派奖，如果发现异常，请及时关闭合作，并且反馈给平台进行处理！
      </p>
    </q-form>
  </page-layout>
</template>
<script setup>
import {ref,reactive} from 'vue'
import { useSelfStore } from 'stores/self';
import { useQuasar } from 'quasar';
import { Rules,formatMoney } from 'src/utils/tools';
import { api } from 'boot/axios'
import { useRoute,useRouter } from 'vue-router';
const route = useRoute()
const router = useRouter()
const store = useSelfStore()
const $q = useQuasar()

const form = reactive({
  shop_sn: '',
  shop_name: '',
  apply_message: '',
})
function submit(){
  api.addPartner(form).then((res)=>{
    $q.notify({type: 'positive',message: res.message||'申请成功！' })
    router.back()
  }).catch(e=>{
    $q.notify({type: 'negative',message: e.message})
  })
}
</script>
<style lang="scss" scoped>

</style>
