潘志宝
2024-09-09 2f0aa40dc7f6ce0c84d5fb10ddaa44eb3920dedc
调度模块
已添加6个文件
1191 ■■■■■ 文件已修改
src/api/model/sche/model/index.ts 63 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/api/model/sche/scheme/index.ts 46 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/views/model/mcs/sche/model/ScheduleModelForm.vue 384 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/views/model/mcs/sche/model/index.vue 170 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/views/model/mcs/sche/scheme/ScheduleSchemeForm.vue 357 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/views/model/mcs/sche/scheme/index.vue 171 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/api/model/sche/model/index.ts
对比新文件
@@ -0,0 +1,63 @@
import request from '@/config/axios'
export interface ScheduleModelVO {
  id: string
  modelCode: string
  modelName: string
  modelType: string
  className: string
  methodName: string
  portLength: number
  paramStructure: string
  modelPath: string
  resultStrId: string
  invocation: string
  status: number,
  paramList: null,
  settingList: null
}
export interface ModelParamVO {
  modelparamportorder: number
  modelparamorder: number
  modelparamtype: string
  modelparamid: string
  datalength: number
}
export interface ScheduleModelPageReqVO extends PageParam {
  modelCode?: string
  modelName?: string
}
// 查询ScheduleModel列表
export const getScheduleModelPage = (params: ScheduleModelPageReqVO) => {
  return request.get({ url: '/model/sche/model/page', params })
}
// 查询ScheduleModel详情
export const getScheduleModel = (id: number) => {
  return request.get({ url: `/model/sche/model/info/${id}`})
}
// 新增ScheduleModel
export const createScheduleModel = (data: ScheduleModelVO) => {
  return request.post({ url: '/model/sche/model/add', data })
}
// 修改ScheduleModel
export const updateScheduleModel = (data: ScheduleModelVO) => {
  return request.put({ url: '/model/sche/model/update', data })
}
// 删除ScheduleModel
export const deleteScheduleModel = (id: number) => {
  return request.delete({ url: '/model/sche/model/delete?id=' + id })
}
// 查询模型参数列表
export const getModelParamList = () => {
  let modelparamListMap = []
  return modelparamListMap
}
src/api/model/sche/scheme/index.ts
对比新文件
@@ -0,0 +1,46 @@
import request from '@/config/axios'
export interface ScheduleScheme {
  id: string
  code: string
  name: string
  triggerMethod: string
  triggerCondition: string
  scheduleObj: string
  scheduleType: string
  scheduleStrategy: string
  modelId: string
  scheduleTime: string
  remark: string
  status: number
}
export interface ScheduleSchemePageReqVO extends PageParam {
  modelCode?: string
  modelName?: string
}
// 查询ScheduleScheme列表
export const getScheduleSchemePage = (params: ScheduleSchemePageReqVO) => {
  return request.get({ url: '/model/sche/scheme/page', params })
}
// 查询ScheduleScheme详情
export const getScheduleScheme = (id: number) => {
  return request.get({ url: `/model/sche/scheme/info/${id}`})
}
// 新增ScheduleScheme
export const createScheduleScheme = (data: ScheduleSchemeVO) => {
  return request.post({ url: '/model/sche/scheme/add', data })
}
// 修改ScheduleScheme
export const updateScheduleScheme = (data: ScheduleSchemeVO) => {
  return request.put({ url: '/model/sche/scheme/update', data })
}
// 删除ScheduleScheme
export const deleteScheduleScheme = (id: number) => {
  return request.delete({ url: '/model/sche/scheme/delete?id=' + id })
}
src/views/model/mcs/sche/model/ScheduleModelForm.vue
对比新文件
@@ -0,0 +1,384 @@
<template>
  <Dialog v-model="dialogVisible" :title="dialogTitle" width="50%">
    <el-form
      ref="formRef"
      v-loading="formLoading"
      :model="formData"
      :rules="formRules"
      label-width="120px"
    >
      <el-row>
        <el-col :span="12">
          <el-form-item label="模型编号" prop="modelCode">
            <el-input v-model="formData.modelCode" placeholder="请输入模型编号" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="模型名称" prop="modelName">
            <el-input v-model="formData.modelName" placeholder="请输入模型名称" />
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="模型类型" prop="modelType">
            <el-input v-model="formData.modelType" placeholder="请输入模型类型" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="调用方式" prop="invocation">
            <el-input v-model="formData.invocation" placeholder="调用方式" />
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
          <el-form-item label="类名" prop="className">
            <el-input v-model="formData.className" placeholder="请输入类名 " />
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="方法名" prop="methodName">
            <el-input v-model="formData.methodName" placeholder="请输入方法名 " />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="参数数量" prop="portLength">
            <el-input v-model="formData.portLength" placeholder="请输入参数数量 " />
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
          <el-form-item label="参数构造" prop="paramStructure">
            <el-input v-model="formData.paramStructure" placeholder="请输入参数构造 " />
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
          <el-form-item label="模型路径" prop="modelPath">
            <el-input v-model="formData.modelPath" placeholder="模型路径 " />
          </el-form-item>
        </el-col>
      </el-row>
      <el-divider content-position="left">输入参数</el-divider>
      <el-table
        :data="formData.paramList"
        border
        style="width: 100%; margin-top: 5px;">
        <el-table-column
          prop=""
          label="端口"
          width="100"
          align="center">
          <template slot-scope="scope">
            <el-input size="mini" v-model="scope.row.modelparamportorder" maxlength="5" clearable
                      style="width:100%;hight:100%"></el-input>
          </template>
        </el-table-column>
        <el-table-column
          prop=""
          label="序号"
          width="100"
          align="center">
          <template slot-scope="scope">
            <el-input size="mini" v-model="scope.row.modelparamorder" maxlength="5" clearable
                      style="width:100%;hight:100%"></el-input>
          </template>
        </el-table-column>
        <el-table-column
          prop=""
          label="类型"
          width="150"
          align="center">
          <template slot-scope="scope">
            <el-select v-model="scope.row.modelparamtype" placeholder="请选择">
              <el-option
                v-for="dict in getIntDictOptions(DICT_TYPE.MODEL_PARAM_TYPE)"
                :key="dict.value"
                :label="dict.label"
                :value="dict.value"
              />
            </el-select>
          </template>
        </el-table-column>
        <el-table-column
          prop=""
          label="参数名称"
          align="center">
          <template slot-scope="scope">
            <el-select
              size="mini"
              v-model="scope.row.modelparamid"
              filterable
              placeholder="请选择">
              <el-option
                v-for="(item, index) in modelparamListMap[scope.row.modelparamtype]"
                :key="index"
                :label="item.name"
                :value="item.id"
                :disabled="!(item.type === scope.row.modelparamtype)">
              </el-option>
            </el-select>
          </template>
        </el-table-column>
        <el-table-column
          prop=""
          label="参数长度"
          width="120"
          align="center">
          <template slot-scope="scope">
            <el-input size="mini" v-model="scope.row.datalength" maxlength="50" clearable
                      style="width:100%;hight:100%"></el-input>
          </template>
        </el-table-column>
        <el-table-column
          prop=""
          label="操作"
          width="100"
          align="center">
          <template slot-scope="scope">
            <el-button
              @click.native.prevent="addRow(scope.$index, formData.paramList)"
              type="text"
              size="small">
              添加
            </el-button>
            <el-button
              @click.native.prevent="deleteRow(scope.$index, formData.paramList)"
              type="text"
              size="small">
              删除
            </el-button>
          </template>
        </el-table-column>
      </el-table>
      <el-divider content-position="left">设置参数</el-divider>
      <el-table
        :data="formData.paramList"
        border
        style="width: 100%; margin-top: 5px;">
        <el-table-column
          prop=""
          label="键"
          align="center">
          <template slot-scope="scope">
            <el-input size="mini" v-model="scope.row.key" maxlength="256" clearable
                      style="width:100%;hight:100%"></el-input>
          </template>
        </el-table-column>
        <el-table-column
          prop=""
          label="名称"
          align="center">
          <template slot-scope="scope">
            <el-input size="mini" v-model="scope.row.name" maxlength="256" clearable
                      style="width:100%;hight:100%"></el-input>
          </template>
        </el-table-column>
        <el-table-column
          prop=""
          label="类型"
          align="center">
          <template slot-scope="scope">
            <el-input size="mini" v-model="scope.row.valuetype" maxlength="256" clearable
                      style="width:100%;hight:100%"></el-input>
          </template>
        </el-table-column>
        <el-table-column
          prop=""
          label="值"
          align="center">
          <template slot-scope="scope">
            <el-input size="mini" v-model="scope.row.value" maxlength="256" clearable
                      style="width:100%;hight:100%"></el-input>
          </template>
        </el-table-column>
        <el-table-column
          prop=""
          label="操作"
          width="100"
          align="center">
          <template slot-scope="scope">
            <el-button
              @click.native.prevent="addRow(scope.$index, formData.settingList)"
              type="text"
              size="small">
              添加
            </el-button>
            <el-button
              @click.native.prevent="deleteRow(scope.$index, formData.settingList)"
              type="text"
              size="small">
              删除
            </el-button>
          </template>
        </el-table-column>
      </el-table>
    </el-form>
    <template #footer>
      <el-button :disabled="formLoading" type="primary" @click="submitForm">确 定</el-button>
      <el-button @click="dialogVisible = false">取 消</el-button>
    </template>
  </Dialog>
</template>
<script lang="ts" setup>
  import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
  import * as ScheduleModelApi from '@/api/model/sche/model'
  import { CommonStatusEnum } from '@/utils/constants'
  import * as DataSourceConfigApi from "@/api/infra/dataSourceConfig";
  defineOptions({ name: 'ScheduleModelForm' })
  const { t } = useI18n() // 国际化
  const message = useMessage() // 消息弹窗
  const dialogVisible = ref(false) // 弹窗的是否展示
  const dialogTitle = ref('') // 弹窗的标题
  const formLoading = ref(false) // 表单的加载中:1)修改时的数据加载;2)提交的按钮禁用
  const formType = ref('') // 表单的类型:create - 新增;update - 修改
  const formData = ref({
    id: undefined,
    modelCode: undefined,
    modelName: undefined,
    modelType: undefined,
    className: undefined,
    methodName: undefined,
    portLength: undefined,
    paramStructure: undefined,
    modelPath: undefined,
    resultStrId: undefined,
    invocation: undefined,
    status: undefined,
    paramList: [{
      modelparamportorder: '1',
      modelparamorder: '1',
      modelparamtype: '',
      modelparamid: '',
      datalength: ''
    }],
    settingList: [{
      key: '',
      value: '',
      valuetype: '',
      name: ''
    }]
  })
  const formRules = reactive({
    modelCode: [{ required: true, message: '模型编号不能为空', trigger: 'blur' }],
    modelName: [{ required: true, message: '模型名称不能为空', trigger: 'blur' }],
    modelType: [{ required: true, message: '模型类型不能为空', trigger: 'blur' }]
  })
  const formRef = ref() // 表单 Ref
  const modelparamListMap = ref([] as ScheduleModelApi.ModelParamVO[])
  const addRow = function (index, rows) {
    let row = JSON.parse(JSON.stringify(rows[index]))
    rows.splice(index, 0, row)
    this.orderRow(rows)
  }
  const deleteRow = function (index, rows) {
    if (!rows || rows.length === 1) {
      message.error('不能全部删除!')
      return
    }
    rows.splice(index, 1)
    this.orderRow(rows)
  }
  const orderRow = function (rows) {
    let modelparamorder = 0
    let modelparamportorder = 0
    rows.forEach(function (value) {
      if (value.modelparamportorder !== modelparamportorder) {
        modelparamportorder = value.modelparamportorder
        modelparamorder = 1
      }
      value.modelparamorder = modelparamorder
      modelparamorder++
    })
  }
  /** 打开弹窗 */
  const open = async (type: string, id?: number) => {
    dialogVisible.value = true
    dialogTitle.value = t('action.' + type)
    formType.value = type
    resetForm()
    // 修改时,设置数据
    if (id) {
      formLoading.value = true
      try {
        formData.value = await ScheduleModelApi.getScheduleModel(id)
      } finally {
        formLoading.value = false
      }
      // 加载数据源列表
      modelparamListMap.value = await ScheduleModelApi.getModelParamList()
    }
  }
  defineExpose({ open }) // 提供 open 方法,用于打开弹窗
  /** 提交表单 */
  const emit = defineEmits(['success']) // 定义 success 事件,用于操作成功后的回调
  const submitForm = async () => {
    // 校验表单
    if (!formRef) return
    const valid = await formRef.value.validate()
    if (!valid) return
    // 提交请求
    formLoading.value = true
    try {
      const data = formData.value as unknown as ScheduleModelApi.ScheduleModelVO
      if (formType.value === 'create') {
        await ScheduleModelApi.createScheduleModel(data)
        message.success(t('common.createSuccess'))
      } else {
        await ScheduleModelApi.updateScheduleModel(data)
        message.success(t('common.updateSuccess'))
      }
      dialogVisible.value = false
      // 发送操作成功的事件
      emit('success')
    } finally {
      formLoading.value = false
    }
  }
  /** 重置表单 */
  const resetForm = () => {
    formData.value = {
      id: undefined,
      modelCode: undefined,
      modelName: undefined,
      modelType: undefined,
      className: undefined,
      methodName: undefined,
      portLength: undefined,
      paramStructure: undefined,
      modelPath: undefined,
      resultStrId: undefined,
      invocation: undefined,
      status: undefined,
      paramList: [{
        modelparamportorder: '1',
        modelparamorder: '1',
        modelparamtype: '',
        modelparamid: '',
        datalength: ''
      }],
      settingList: [{
        key: '',
        value: '',
        valuetype: '',
        name: ''
      }]
    }
    formRef.value?.resetFields()
  }
</script>
src/views/model/mcs/sche/model/index.vue
对比新文件
@@ -0,0 +1,170 @@
<template>
  <!-- 搜索 -->
  <ContentWrap>
    <el-form
      class="-mb-15px"
      :model="queryParams"
      ref="queryFormRef"
      :inline="true"
      label-width="68px"
    >
      <el-form-item label="模型编号" prop="modelCode">
        <el-input
          v-model="queryParams.modelCode"
          placeholder="请输入模型编号"
          clearable
          @keyup.enter="handleQuery"
          class="!w-240px"
        />
      </el-form-item>
      <el-form-item label="模型名称" prop="modelName">
        <el-input
          v-model="queryParams.modelName"
          placeholder="请输入模型名称"
          clearable
          @keyup.enter="handleQuery"
          class="!w-240px"
        />
      </el-form-item>
      <el-form-item>
        <el-button @click="handleQuery">
          <Icon icon="ep:search" class="mr-5px" />
          搜索
        </el-button>
        <el-button @click="resetQuery">
          <Icon icon="ep:refresh" class="mr-5px" />
          重置
        </el-button>
        <el-button
          type="primary"
          plain
          @click="openForm('create')"
          v-hasPermi="['sche:model:create']"
        >
          <Icon icon="ep:plus" class="mr-5px" />
          新增
        </el-button>
      </el-form-item>
    </el-form>
  </ContentWrap>
  <!-- 列表 -->
  <ContentWrap>
    <el-table v-loading="loading" :data="list">
      <el-table-column label="模型编号" align="center" prop="modelCode" />
      <el-table-column label="模型名称" align="center" prop="modelName" />
      <el-table-column label="模型类型" align="center" prop="modelType" />
      <el-table-column label="类名" align="center" prop="className" />
      <el-table-column label="方法名" align="center" prop="methodName" />
      <el-table-column label="输入参数数量" align="center" prop="portLength" />
      <el-table-column label="参数构造" align="center" prop="paramStructure" />
      <el-table-column label=" 模型路径" align="center" prop="modelPath" />
      <el-table-column label="调用方式" align="center" prop="invocation" />
      <el-table-column label="状态" align="center" prop="status" />
      <el-table-column label="操作" align="center" min-width="110" fixed="right">
        <template #default="scope">
          <el-button
            link
            type="primary"
            @click="openForm('update', scope.row.id)"
            v-hasPermi="['sche:model:update']"
          >
            编辑
          </el-button>
          <el-button
            link
            type="danger"
            @click="handleDelete(scope.row.id)"
            v-hasPermi="['sche:model:delete']"
          >
            删除
          </el-button>
        </template>
      </el-table-column>
    </el-table>
    <!-- 分页 -->
    <Pagination
      :total="total"
      v-model:page="queryParams.pageNo"
      v-model:limit="queryParams.pageSize"
      @pagination="getList"
    />
  </ContentWrap>
  <!-- 表单弹窗:添加/修改 -->
  <ScheduleModelForm ref="formRef" @success="getList" />
</template>
<script lang="ts" setup>
  import {DICT_TYPE, getIntDictOptions} from '@/utils/dict'
  import {dateFormatter} from '@/utils/formatTime'
  import download from '@/utils/download'
  import * as ScheduleModelApi from '@/api/model/sche/model'
  import ScheduleModelForm from './ScheduleModelForm.vue'
  defineOptions({name: 'ScheduleModel'})
  const message = useMessage() // 消息弹窗
  const {t} = useI18n() // 国际化
  const loading = ref(true) // 列表的加载中
  const total = ref(0) // 列表的总页数
  const list = ref([]) // 列表的数据
  const queryParams = reactive({
    pageNo: 1,
    pageSize: 10,
    modelCode: undefined,
    modelName: undefined
  })
  const queryFormRef = ref() // 搜索的表单
  const exportLoading = ref(false) // 导出的加载中
  /** 查询列表 */
  const getList = async () => {
    loading.value = true
    try {
      const page = await ScheduleModelApi.getScheduleModelPage(queryParams)
      list.value = page.list
      total.value = page.total
    } finally {
      loading.value = false
    }
  }
  /** 搜索按钮操作 */
  const handleQuery = () => {
    queryParams.pageNo = 1
    getList()
  }
  /** 重置按钮操作 */
  const resetQuery = () => {
    queryFormRef.value.resetFields()
    handleQuery()
  }
  /** 添加/修改操作 */
  const formRef = ref()
  const openForm = (type: string, id?: number) => {
    formRef.value.open(type, id)
  }
  /** 删除按钮操作 */
  const handleDelete = async (id: number) => {
    try {
      // 删除的二次确认
      await message.delConfirm()
      // 发起删除
      await ScheduleModelApi.deleteScheduleModel(id)
      message.success(t('common.delSuccess'))
      // 刷新列表
      await getList()
    } catch {
    }
  }
  /** 初始化 **/
  onMounted(async () => {
    await getList()
  })
</script>
src/views/model/mcs/sche/scheme/ScheduleSchemeForm.vue
对比新文件
@@ -0,0 +1,357 @@
<template>
  <Dialog v-model="dialogVisible" :title="dialogTitle" width="50%">
    <el-form
      ref="formRef"
      v-loading="formLoading"
      :model="formData"
      :rules="formRules"
      label-width="120px"
    >
      <el-row>
        <el-col :span="12">
          <el-form-item label="模型编号" prop="modelCode">
            <el-input v-model="formData.modelCode" placeholder="请输入模型编号" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="模型名称" prop="modelName">
            <el-input v-model="formData.modelName" placeholder="请输入模型名称" />
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="模型类型" prop="modelType">
            <el-input v-model="formData.modelType" placeholder="请输入模型类型" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="调用方式" prop="invocation">
            <el-input v-model="formData.invocation" placeholder="调用方式" />
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
          <el-form-item label="类名" prop="className">
            <el-input v-model="formData.className" placeholder="请输入类名 " />
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="方法名" prop="methodName">
            <el-input v-model="formData.methodName" placeholder="请输入方法名 " />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="参数数量" prop="portLength">
            <el-input v-model="formData.portLength" placeholder="请输入参数数量 " />
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
          <el-form-item label="参数构造" prop="paramStructure">
            <el-input v-model="formData.paramStructure" placeholder="请输入参数构造 " />
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
          <el-form-item label="模型路径" prop="modelPath">
            <el-input v-model="formData.modelPath" placeholder="模型路径 " />
          </el-form-item>
        </el-col>
      </el-row>
      <el-divider content-position="left">输入参数</el-divider>
      <el-table
        :data="formData.paramList"
        border
        style="width: 100%; margin-top: 5px;">
        <el-table-column
          prop=""
          label="端口"
          width="100"
          align="center">
          <template slot-scope="scope">
            <el-input size="mini" v-model="scope.row.modelparamportorder" maxlength="5" clearable
                      style="width:100%;hight:100%"></el-input>
          </template>
        </el-table-column>
        <el-table-column
          prop=""
          label="序号"
          width="100"
          align="center">
          <template slot-scope="scope">
            <el-input size="mini" v-model="scope.row.modelparamorder" maxlength="5" clearable
                      style="width:100%;hight:100%"></el-input>
          </template>
        </el-table-column>
        <el-table-column
          prop=""
          label="类型"
          width="150"
          align="center">
          <template slot-scope="scope">
            <el-select v-model="scope.row.modelparamtype" placeholder="请选择">
              <el-option
                v-for="dict in getIntDictOptions(DICT_TYPE.MODEL_PARAM_TYPE)"
                :key="dict.value"
                :label="dict.label"
                :value="dict.value"
              />
            </el-select>
          </template>
        </el-table-column>
        <el-table-column
          prop=""
          label="参数名称"
          align="center">
          <template slot-scope="scope">
            <el-select
              size="mini"
              v-model="scope.row.modelparamid"
              filterable
              placeholder="请选择">
              <el-option
                v-for="(item, index) in modelparamListMap[scope.row.modelparamtype]"
                :key="index"
                :label="item.name"
                :value="item.id"
                :disabled="!(item.type === scope.row.modelparamtype)">
              </el-option>
            </el-select>
          </template>
        </el-table-column>
        <el-table-column
          prop=""
          label="参数长度"
          width="120"
          align="center">
          <template slot-scope="scope">
            <el-input size="mini" v-model="scope.row.datalength" maxlength="50" clearable
                      style="width:100%;hight:100%"></el-input>
          </template>
        </el-table-column>
        <el-table-column
          prop=""
          label="操作"
          width="100"
          align="center">
          <template slot-scope="scope">
            <el-button
              @click.native.prevent="addRow(scope.$index, formData.paramList)"
              type="text"
              size="small">
              添加
            </el-button>
            <el-button
              @click.native.prevent="deleteRow(scope.$index, formData.paramList)"
              type="text"
              size="small">
              删除
            </el-button>
          </template>
        </el-table-column>
      </el-table>
      <el-divider content-position="left">设置参数</el-divider>
      <el-table
        :data="formData.paramList"
        border
        style="width: 100%; margin-top: 5px;">
        <el-table-column
          prop=""
          label="键"
          align="center">
          <template slot-scope="scope">
            <el-input size="mini" v-model="scope.row.key" maxlength="256" clearable
                      style="width:100%;hight:100%"></el-input>
          </template>
        </el-table-column>
        <el-table-column
          prop=""
          label="名称"
          align="center">
          <template slot-scope="scope">
            <el-input size="mini" v-model="scope.row.name" maxlength="256" clearable
                      style="width:100%;hight:100%"></el-input>
          </template>
        </el-table-column>
        <el-table-column
          prop=""
          label="类型"
          align="center">
          <template slot-scope="scope">
            <el-input size="mini" v-model="scope.row.valuetype" maxlength="256" clearable
                      style="width:100%;hight:100%"></el-input>
          </template>
        </el-table-column>
        <el-table-column
          prop=""
          label="值"
          align="center">
          <template slot-scope="scope">
            <el-input size="mini" v-model="scope.row.value" maxlength="256" clearable
                      style="width:100%;hight:100%"></el-input>
          </template>
        </el-table-column>
        <el-table-column
          prop=""
          label="操作"
          width="100"
          align="center">
          <template slot-scope="scope">
            <el-button
              @click.native.prevent="addRow(scope.$index, formData.settingList)"
              type="text"
              size="small">
              添加
            </el-button>
            <el-button
              @click.native.prevent="deleteRow(scope.$index, formData.settingList)"
              type="text"
              size="small">
              删除
            </el-button>
          </template>
        </el-table-column>
      </el-table>
    </el-form>
    <template #footer>
      <el-button :disabled="formLoading" type="primary" @click="submitForm">确 定</el-button>
      <el-button @click="dialogVisible = false">取 消</el-button>
    </template>
  </Dialog>
</template>
<script lang="ts" setup>
  import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
  import * as ScheduleModelApi from '@/api/model/sche/model'
  import { CommonStatusEnum } from '@/utils/constants'
  import * as DataSourceConfigApi from "@/api/infra/dataSourceConfig";
  defineOptions({ name: 'ScheduleModelForm' })
  const { t } = useI18n() // 国际化
  const message = useMessage() // 消息弹窗
  const dialogVisible = ref(false) // 弹窗的是否展示
  const dialogTitle = ref('') // 弹窗的标题
  const formLoading = ref(false) // 表单的加载中:1)修改时的数据加载;2)提交的按钮禁用
  const formType = ref('') // 表单的类型:create - 新增;update - 修改
  const formData = ref({
    id: undefined,
    code: undefined,
    name: undefined,
    triggerMethod: undefined,
    triggerCondition: undefined,
    scheduleObj: undefined,
    scheduleType: undefined,
    scheduleStrategy: undefined,
    modelId: undefined,
    scheduleTime: undefined,
    remark: undefined,
    status: 0
  })
  const formRules = reactive({
    code: [{ required: true, message: '编号不能为空', trigger: 'blur' }],
    name: [{ required: true, message: '名称不能为空', trigger: 'blur' }]
  })
  const formRef = ref() // 表单 Ref
  const modelparamListMap = ref([] as ScheduleModelApi.ModelParamVO[])
  const addRow = function (index, rows) {
    let row = JSON.parse(JSON.stringify(rows[index]))
    rows.splice(index, 0, row)
    this.orderRow(rows)
  }
  const deleteRow = function (index, rows) {
    if (!rows || rows.length === 1) {
      message.error('不能全部删除!')
      return
    }
    rows.splice(index, 1)
    this.orderRow(rows)
  }
  const orderRow = function (rows) {
    let modelparamorder = 0
    let modelparamportorder = 0
    rows.forEach(function (value) {
      if (value.modelparamportorder !== modelparamportorder) {
        modelparamportorder = value.modelparamportorder
        modelparamorder = 1
      }
      value.modelparamorder = modelparamorder
      modelparamorder++
    })
  }
  /** 打开弹窗 */
  const open = async (type: string, id?: number) => {
    dialogVisible.value = true
    dialogTitle.value = t('action.' + type)
    formType.value = type
    resetForm()
    // 修改时,设置数据
    if (id) {
      formLoading.value = true
      try {
        formData.value = await ScheduleModelApi.getScheduleModel(id)
      } finally {
        formLoading.value = false
      }
      // 加载数据源列表
      modelparamListMap.value = await ScheduleModelApi.getModelParamList()
    }
  }
  defineExpose({ open }) // 提供 open 方法,用于打开弹窗
  /** 提交表单 */
  const emit = defineEmits(['success']) // 定义 success 事件,用于操作成功后的回调
  const submitForm = async () => {
    // 校验表单
    if (!formRef) return
    const valid = await formRef.value.validate()
    if (!valid) return
    // 提交请求
    formLoading.value = true
    try {
      const data = formData.value as unknown as ScheduleModelApi.ScheduleModelVO
      if (formType.value === 'create') {
        await ScheduleModelApi.createScheduleModel(data)
        message.success(t('common.createSuccess'))
      } else {
        await ScheduleModelApi.updateScheduleModel(data)
        message.success(t('common.updateSuccess'))
      }
      dialogVisible.value = false
      // 发送操作成功的事件
      emit('success')
    } finally {
      formLoading.value = false
    }
  }
  /** 重置表单 */
  const resetForm = () => {
    formData.value = {
      id: undefined,
      code: undefined,
      name: undefined,
      triggerMethod: undefined,
      triggerCondition: undefined,
      scheduleObj: undefined,
      scheduleType: undefined,
      scheduleStrategy: undefined,
      modelId: undefined,
      scheduleTime: undefined,
      remark: undefined,
      status: 0
    }
    formRef.value?.resetFields()
  }
</script>
src/views/model/mcs/sche/scheme/index.vue
对比新文件
@@ -0,0 +1,171 @@
<template>
  <!-- 搜索 -->
  <ContentWrap>
    <el-form
      class="-mb-15px"
      :model="queryParams"
      ref="queryFormRef"
      :inline="true"
      label-width="68px"
    >
      <el-form-item label="方案编号" prop="code">
        <el-input
          v-model="queryParams.code"
          placeholder="请输入方案编号"
          clearable
          @keyup.enter="handleQuery"
          class="!w-240px"
        />
      </el-form-item>
      <el-form-item label="方案名称" prop="name">
        <el-input
          v-model="queryParams.name"
          placeholder="请输入方案名称"
          clearable
          @keyup.enter="handleQuery"
          class="!w-240px"
        />
      </el-form-item>
      <el-form-item>
        <el-button @click="handleQuery">
          <Icon icon="ep:search" class="mr-5px" />
          搜索
        </el-button>
        <el-button @click="resetQuery">
          <Icon icon="ep:refresh" class="mr-5px" />
          重置
        </el-button>
        <el-button
          type="primary"
          plain
          @click="openForm('create')"
          v-hasPermi="['sche:scheme:create']"
        >
          <Icon icon="ep:plus" class="mr-5px" />
          新增
        </el-button>
      </el-form-item>
    </el-form>
  </ContentWrap>
  <!-- 列表 -->
  <ContentWrap>
    <el-table v-loading="loading" :data="list">
      <el-table-column label="方案编号" align="center" prop="code" />
      <el-table-column label="方案名称" align="center" prop="name" />
      <el-table-column label="触发方式" align="center" prop="triggerMethod" />
      <el-table-column label="触发条件" align="center" prop="triggerCondition" />
      <el-table-column label="方法名" align="center" prop="methodName" />
      <el-table-column label="调整对象" align="center" prop="scheduleObj" />
      <el-table-column label="调整类型" align="center" prop="scheduleType" />
      <el-table-column label=" 调整策略" align="center" prop="scheduleStrategy" />
      <el-table-column label="调度时间" align="center" prop="scheduleTime" />
      <el-table-column label="备注" align="center" prop="remark" />
      <el-table-column label="状态" align="center" prop="status" />
      <el-table-column label="操作" align="center" min-width="110" fixed="right">
        <template #default="scope">
          <el-button
            link
            type="primary"
            @click="openForm('update', scope.row.id)"
            v-hasPermi="['sche:scheme:update']"
          >
            编辑
          </el-button>
          <el-button
            link
            type="danger"
            @click="handleDelete(scope.row.id)"
            v-hasPermi="['sche:scheme:delete']"
          >
            删除
          </el-button>
        </template>
      </el-table-column>
    </el-table>
    <!-- 分页 -->
    <Pagination
      :total="total"
      v-model:page="queryParams.pageNo"
      v-model:limit="queryParams.pageSize"
      @pagination="getList"
    />
  </ContentWrap>
  <!-- 表单弹窗:添加/修改 -->
  <ScheduleSchemeForm ref="formRef" @success="getList" />
</template>
<script lang="ts" setup>
  import {DICT_TYPE, getIntDictOptions} from '@/utils/dict'
  import {dateFormatter} from '@/utils/formatTime'
  import download from '@/utils/download'
  import * as ScheduleSchemeApi from '@/api/model/sche/scheme'
  import ScheduleSchemeForm from './ScheduleSchemeForm.vue'
  defineOptions({name: 'ScheduleScheme'})
  const message = useMessage() // 消息弹窗
  const {t} = useI18n() // 国际化
  const loading = ref(true) // 列表的加载中
  const total = ref(0) // 列表的总页数
  const list = ref([]) // 列表的数据
  const queryParams = reactive({
    pageNo: 1,
    pageSize: 10,
    code: undefined,
    name: undefined
  })
  const queryFormRef = ref() // 搜索的表单
  const exportLoading = ref(false) // 导出的加载中
  /** 查询列表 */
  const getList = async () => {
    loading.value = true
    try {
      const page = await ScheduleSchemeApi.getScheduleSchemePage(queryParams)
      list.value = page.list
      total.value = page.total
    } finally {
      loading.value = false
    }
  }
  /** 搜索按钮操作 */
  const handleQuery = () => {
    queryParams.pageNo = 1
    getList()
  }
  /** 重置按钮操作 */
  const resetQuery = () => {
    queryFormRef.value.resetFields()
    handleQuery()
  }
  /** 添加/修改操作 */
  const formRef = ref()
  const openForm = (type: string, id?: number) => {
    formRef.value.open(type, id)
  }
  /** 删除按钮操作 */
  const handleDelete = async (id: number) => {
    try {
      // 删除的二次确认
      await message.delConfirm()
      // 发起删除
      await ScheduleSchemeApi.deleteScheduleScheme(id)
      message.success(t('common.delSuccess'))
      // 刷新列表
      await getList()
    } catch {
    }
  }
  /** 初始化 **/
  onMounted(async () => {
    await getList()
  })
</script>