graphite-digestion-web/src/views/taskLog/index.vue

<script setup lang="ts">
import { delPhoto, photoList } from 'apis/home'
import Photo from 'components/home/Photo/index.vue'
import { ElMessageBox } from 'element-plus'
import { FtMessage } from 'libs/message'
import { ref, useTemplateRef } from 'vue'

const btnList = [
  {
    name: '查看照片',
    type: 'primary',
    serverUrl: 'edit',
    serverCondition: 1,
  },
  {
    name: '删除',
    type: 'danger',
    serverUrl: 'del',
    serverCondition: 2,
  },
]
const columns = [
  {
    type: 'selection',
  },
  {
    title: '模式',
    key: 'mode',
  },
  {
    title: '矿石名称',
    key: 'oreName',
  },
  {
    title: '工艺名称',
    key: 'craftsName',
  },
  {
    title: '创建时间',
    key: 'createTime',
  },
]

const tableRef = useTemplateRef('tableRef')

const del = async (selectedRows: any) => {
  const ids = selectedRows.map((item: any) => item.id)
  await ElMessageBox.confirm('确定删除当前选中的行?', '消息', {
    confirmButtonText: '确认',
    cancelButtonText: '取消',
    type: 'warning',
  })
  await delPhoto(ids)
  FtMessage.success('删除成功')
  tableRef.value?.initData()
}

const id = ref(0)
const photoVisible = ref(false)
const edit = (selectedRows: any) => {
  id.value = selectedRows[0].id
  photoVisible.value = true
}
</script>

<template>
  <div>
    <FtTable ref="tableRef" has-header has-page :columns="columns" :btn-list="btnList" :get-data-fn="photoList" @edit="edit" @del="del" />
    <Photo v-if="photoVisible" :id @cancel="photoVisible = false" />
  </div>
</template>

<style scoped lang="scss">

</style>