dg_erp/jy-ui/src/views/flow/taskTodo/index.vue

<script setup lang="ts">
import AForm from '@/components/AForm/index.vue'
import { FormConfigType } from '@/components/AForm/type'
import { ToolbarConfigType } from '@/components/AToolbar/type'
import { ColumnConfigType } from '@/components/ATable/type'
import { StrAnyObj, StrAnyObjArr } from '@/typings'
import { useHandleData } from '@/utils/useHandleData'
import { getPageApi, getDetailApi, addApi, editApi, deleteApi } from '@/api/system/config'
import { getToDoPageApi } from '@/api/flow/execute'

const queryRef = ref<InstanceType<typeof AForm>>()
const formRef = ref<InstanceType<typeof AForm>>()

const showQuery = ref<boolean>(true)
const pageTotal = ref<number>(0)

const queryData = ref<StrAnyObj>({ pageNum: 1, pageSize: 10 })
const tableData = ref<StrAnyObjArr>([])
const formData = ref<StrAnyObj>({})

const dialogTitle = ref<string>('')
const dialogVisible = ref<boolean>(false)

const queryConfig: FormConfigType[] = [
  {
    type: 'input',
    prop: 'nodeName',
    label: '任务名称'
  },
  {
    type: 'select',
    prop: 'flowStatus',
    label: '流程状态',
    dict: 'flow_status'
  },
  {
    type: 'datePicker',
    prop: 'createTime',
    label: '创建时间',
    datePickerType: 'date',
    format: 'YYYY-MM-DD',
    valueFormat: 'YYYY-MM-DD 00:00:00'
  }
]

const toolbarConfig: ToolbarConfigType[] = [
  {
    common: 'search',
    click() {
      queryData.value.pageNum = 1
      getPage()
    }
  },
  {
    common: 'reset',
    click() {
      queryRef.value?.resetFields()
      getPage()
    }
  }
  // {
  //   common: 'add',
  //   permissions: 'sysConfig:add',
  //   click() {
  //     dialogVisible.value = true
  //     dialogTitle.value = '新增'
  //   }
  // }
]

const columnConfig: ColumnConfigType[] = [
  {
    prop: 'flowName',
    label: '流程名称'
  },
  {
    prop: 'nodeName',
    label: '任务名称'
  },
  {
    prop: 'approver',
    label: '审批人'
  },
  {
    prop: 'transferredBy',
    label: '转办人'
  },
  {
    prop: 'delegate',
    label: '委派人'
  },
  {
    prop: 'flowStatus',
    label: '流程状态',
    dict: 'flow_status'
  },
  {
    prop: 'activityStatus',
    label: '激活状态',
    dict: 'activity_status'
  },
  {
    prop: 'createTime',
    label: '创建时间'
  },
  {
    width: 200,
    handleConfig: [
      // {
      //   common: 'update',
      //   permissions: 'sysConfig:edit',
      //   click(row) {
      //     dialogVisible.value = true
      //     dialogTitle.value = '编辑'
      //     getDetailApi({ id: row.id }).then((resp: StrAnyObj) => {
      //       formData.value = resp
      //     })
      //   }
      // },
      // {
      //   common: 'delete',
      //   permissions: 'sysConfig:delete',
      //   click(row) {
      //     handleRemove([row.id])
      //   }
      // }
    ]
  }
]

const formConfig: FormConfigType[] = [
  {
    type: 'input',
    prop: 'name',
    label: '参数名称',
    rule: [{ required: true, message: '参数名称不能为空', trigger: 'blur' }]
  },
  {
    type: 'input',
    prop: 'code',
    label: '参数编码',
    rule: [{ required: true, message: '参数编码不能为空', trigger: 'blur' }]
  },
  {
    type: 'input',
    prop: 'value',
    label: '参数值',
    rule: [{ required: true, message: '参数键值不能为空', trigger: 'blur' }]
  },
  {
    type: 'radio',
    prop: 'builtin',
    label: '系统内置',
    dict: 'yes_no',
    rule: [{ required: true, message: '系统内置不能为空', trigger: 'blur' }]
  },
  {
    type: 'input',
    prop: 'remark',
    label: '备注',
    itemType: 'textarea',
    rows: 5
  }
]

onMounted(() => {
  getPage()
})

function getPage() {
  getToDoPageApi(queryData.value).then((resp) => {
    tableData.value = resp.records
    pageTotal.value = resp.total
  })
}

function formSubmit() {
  formRef.value?.validate(() => {
    if (formData.value.id) {
      editApi(formData.value).then(() => {
        dialogVisible.value = false
        ElMessage.success('修改成功')
        getPage()
      })
    } else {
      addApi(formData.value).then(() => {
        dialogVisible.value = false
        ElMessage.success('新增成功')
        getPage()
      })
    }
  })
}

function formClosed() {
  formRef.value?.resetFields()
}
</script>

<template>
  <div>
    <el-card v-if="showQuery">
      <a-form ref="queryRef" v-model="queryData" :config="queryConfig" :span="6"> </a-form>
    </el-card>

    <a-table
      :data="tableData"
      :page-total="pageTotal"
      :toolbar-config="toolbarConfig"
      :column-config="columnConfig"
      v-model:showQuery="showQuery"
      v-model:page-num="queryData.pageNum"
      v-model:page-size="queryData.pageSize"
      @page-num-change="getPage"
      @page-size-change="getPage"
    >
    </a-table>

    <a-dialog
      v-model="dialogVisible"
      :title="dialogTitle"
      @submit="formSubmit"
      @closed="formClosed"
    >
      <a-form ref="formRef" v-model="formData" :config="formConfig" :span="24"> </a-form>
    </a-dialog>
  </div>
</template>