<script setup lang="ts">
import XCellList from '@af-mobile-client-vue3/components/data/XCellList/index.vue'
import { computed } from 'vue'
import { useRoute, useRouter } from 'vue-router'

const router = useRouter()
const configName = 'userinfoContractCRUD'
const serviceName = 'af-system'
const userId = computed(() => useRoute().query.userId?.toString() || '')
function addContract() {
  router.push({
    name: 'addcontract',
    query: {
      userId: userId.value,
    },
  })
}
function previewContract(res) {
  router.push({
    name: 'viewContract',
    query: {
      previewPath: res.c_f_signature_url,
    },
  })
}
function sign(res) {
  router.push({
    name: 'signcontract',
    query: {
      id: res.c_f_contract_signature_id,
    },
  })
}
</script>

<template>
  <XCellList
    :config-name="configName"
    :service-name="serviceName"
    :custom-add="true"
    :fix-query-form="{
      c_f_userinfo_id: userId,
    }"
    @add="addContract"
    @preview-contract="previewContract"
    @sign-contract="sign"
  />
</template>
