src/views/model/sche/scheme/ScheduleSchemeForm.vue

@@ -10,12 +10,12 @@
      <el-row>
        <el-col :span="12">
          <el-form-item label="方案编号" prop="code">
            <el-input v-model="formData.code" placeholder="请输入方案编号" />
            <el-input v-model="formData.code" placeholder="请输入方案编号"/>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="方案名称" prop="name">
            <el-input v-model="formData.name" placeholder="请输入方案名称" />
            <el-input v-model="formData.name" placeholder="请输入方案名称"/>
          </el-form-item>
        </el-col>
      </el-row>
@@ -24,7 +24,7 @@
          <el-form-item label="触发方式" prop="triggerMethod">
            <el-select v-model="formData.triggerMethod" placeholder="请选择">
              <el-option
                v-for="dict in getIntDictOptions(DICT_TYPE.SCHE_TRIGGER_METHOD)"
                v-for="dict in getDictOptions(DICT_TYPE.SCHE_TRIGGER_METHOD)"
                :key="dict.value"
                :label="dict.label"
                :value="dict.value"
@@ -34,26 +34,26 @@
        </el-col>
        <el-col :span="12">
          <el-form-item label="触发条件" prop="triggerCondition">
            <el-input v-model="formData.triggerCondition" placeholder="请输入触发条件" />
            <el-input v-model="formData.triggerCondition" placeholder="请输入触发条件"/>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="调整对象" prop="scheduleObj">
            <el-input v-model="formData.scheduleObj" placeholder="请输入调整对象" />
            <el-input v-model="formData.scheduleObj" placeholder="请输入调整对象"/>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="调整类型" prop="scheduleType">
            <el-input v-model="formData.scheduleType" placeholder="请输入调整类型" />
            <el-input v-model="formData.scheduleType" placeholder="请输入调整类型"/>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="调整策略" prop="scheduleStrategy">
            <el-input v-model="formData.scheduleStrategy" placeholder="请输入调整策略 " />
            <el-input v-model="formData.scheduleStrategy" placeholder="请输入调整策略 "/>
          </el-form-item>
        </el-col>
        <el-col :span="12">
@@ -71,9 +71,23 @@
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="关联项目">
            <el-select v-model="formData.mpkprojectid" placeholder="请选择">
              <el-option
                v-for="item in mpkProjectList"
                :key="item.id"
                :label="item.projectName"
                :value="item.id"/>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
          <el-form-item label="备注" prop="remark">
            <el-input v-model="formData.remark" placeholder="请输入备注"  type="textarea" maxlength="100"
            <el-input v-model="formData.remark" placeholder="请输入备注" type="textarea"
                      maxlength="100"
                      show-word-limit/>
          </el-form-item>
        </el-col>
@@ -86,20 +100,126 @@
  </Dialog>
</template>
<script lang="ts" setup>
  import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
  import * as ScheduleSchemeApi from '@/api/model/sche/scheme'
  import { CommonStatusEnum } from '@/utils/constants'
  import * as ScheduleModelApi from "@/api/model/sche/model";
import {DICT_TYPE, getDictOptions} from '@/utils/dict'
import * as ScheduleSchemeApi from '@/api/model/sche/scheme'
import {CommonStatusEnum} from '@/utils/constants'
import * as ScheduleModelApi from "@/api/model/sche/model";
import * as ProjectApi from '@/api/model/mpk/project'

  defineOptions({ name: 'ScheduleSchemeForm' })
defineOptions({name: 'ScheduleSchemeForm'})

  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({
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,
  mpkprojectid: undefined,
})
const formRules = reactive({
  code: [{required: true, message: '编号不能为空', trigger: 'blur'}],
  name: [{required: true, message: '名称不能为空', trigger: 'blur'}],
  triggerMethod: [{required: true, message: '触发方式不能为空', trigger: 'blur'}],
  triggerCondition: [{required: true, message: '触发条件不能为空', trigger: 'blur'}],
  modelId: [{required: true, message: '调度模型不能为空', trigger: 'blur'}],
  triggerCondition: [{required: true, message: '触发条件不能为空', trigger: 'blur'}],
})
const formRef = ref() // 表单 Ref
const scheduleModelList = ref([] as ScheduleModelApi.ScheduleModelVO[])
const mpkProjectList = ref([])
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 ScheduleSchemeApi.getScheduleScheme(id)
    } finally {
      formLoading.value = false
    }
  }
  // 加载调度模型列表
  scheduleModelList.value = await ScheduleModelApi.getScheduleModelList()

  // 获取mpk项目列表
  mpkProjectList.value = await ProjectApi.list()
}
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 ScheduleSchemeApi.ScheduleSchemeVO
    if (formType.value === 'create') {
      await ScheduleSchemeApi.createScheduleScheme(data)
      message.success(t('common.createSuccess'))
    } else {
      await ScheduleSchemeApi.updateScheduleScheme(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,
@@ -111,105 +231,9 @@
    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 scheduleModelList = ref([] as ScheduleModelApi.ScheduleModelVO[])

  const addRow = function (index, rows) {
    let row = JSON.parse(JSON.stringify(rows[index]))
    rows.splice(index, 0, row)
    this.orderRow(rows)
    status: CommonStatusEnum.ENABLE,
    mpkprojectid: undefined
  }

  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 ScheduleSchemeApi.getScheduleScheme(id)
      } finally {
        formLoading.value = false
      }
    }
    // 加载调度模型列表
    scheduleModelList.value = await ScheduleModelApi.getScheduleModelList()
  }
  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 ScheduleSchemeApi.ScheduleSchemeVO
      if (formType.value === 'create') {
        await ScheduleSchemeApi.createScheduleScheme(data)
        message.success(t('common.createSuccess'))
      } else {
        await ScheduleSchemeApi.updateScheduleScheme(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: CommonStatusEnum.ENABLE
    }
    formRef.value?.resetFields()
  }
  formRef.value?.resetFields()
}
</script>