<template>
  <div>
    <div class="oa-sys-list-view">
      <div class="title">合同撤销</div>
      <Form :pageKey="pageKey" />
      <Table :pageKey="pageKey" :request="request" :column="column" />
    </div>
  </div>
</template>
<script lang="ts" setup>
import Form from '../components/Form.vue'
import Table from '../components/Table.vue'
/**
 * @description 合同撤销
 */
defineOptions({
  name: 'RescindContract'
})

const pageKey = 'rescind-contract'
const request = {
  url: '/contractF/page',
  params: {
    type: 3 // 类型(1变更 2解除 3撤销 4终止 5纠纷)
  }
}
const column = [
  {
    label: '合同编号',
    prop: 'contractNumber'
  },
  {
    label: '合同名称',
    prop: 'contractName',
    tooltip: true
  },
  {
    label: '撤销原因',
    prop: 'changeReason',
    tooltip: true
  },
  {
    label: '原合同金额（万元）',
    prop: 'contractAmount',
    width: 200
  },
  {
    label: '撤销金额（万元）',
    prop: 'changeAmount',
    width: 200
  },
  {
    label: '撤销方式',
    prop: 'changeDetail',
    tooltip: true
  },
  {
    label: '备注',
    prop: 'bz',
    tooltip: true
  }
]
</script>
<style scoped lang="scss">
.oa-sys-list-view {
  .title {
    height: 32px;
    font-weight: bold;
    font-size: 24px;
    color: #121518;
    margin-bottom: 20px;
  }
}
</style>
