FollowUpRecordBusinessForm.vue 1.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142
  1. <template>
  2. <el-table :data="formData" :show-overflow-tooltip="true" :stripe="true" height="120">
  3. <el-table-column label="商机名称" fixed="left" align="center" prop="name" />
  4. <el-table-column
  5. label="商机金额"
  6. align="center"
  7. prop="totalPrice"
  8. :formatter="erpPriceTableColumnFormatter"
  9. />
  10. <el-table-column label="客户名称" align="center" prop="customerName" />
  11. <el-table-column label="商机组" align="center" prop="statusTypeName" />
  12. <el-table-column label="商机阶段" align="center" prop="statusName" />
  13. <el-table-column align="center" fixed="right" label="操作" width="80">
  14. <template #default="{ $index }">
  15. <el-button link type="danger" @click="handleDelete($index)"> 移除</el-button>
  16. </template>
  17. </el-table-column>
  18. </el-table>
  19. </template>
  20. <script lang="ts" setup>
  21. import { erpPriceTableColumnFormatter } from '@/utils'
  22. const props = defineProps<{
  23. businesses: undefined
  24. }>()
  25. const formData = ref([])
  26. /** 初始化商机列表 */
  27. watch(
  28. () => props.businesses,
  29. async (val) => {
  30. formData.value = val
  31. },
  32. { immediate: true }
  33. )
  34. /** 删除按钮操作 */
  35. const handleDelete = (index: number) => {
  36. formData.value.splice(index, 1)
  37. }
  38. </script>