dongyukun
6 天以前 f4e6a890da2884777281031a9c736c7659c2a74a
提交 | 用户 | 时间
2f0aa4 1 <template>
6badb7 2   <Dialog v-model="dialogVisible" :title="dialogTitle" width="60%">
2f0aa4 3     <el-form
4       ref="formRef"
5       v-loading="formLoading"
6       :model="formData"
7       :rules="formRules"
8       label-width="120px"
9     >
22bece 10       <el-divider content-position="left">基本信息</el-divider>
2f0aa4 11       <el-row>
12         <el-col :span="12">
13           <el-form-item label="模型编号" prop="modelCode">
14             <el-input v-model="formData.modelCode" placeholder="请输入模型编号" />
15           </el-form-item>
16         </el-col>
17       </el-row>
18       <el-row>
19         <el-col :span="12">
20           <el-form-item label="模型类型" prop="modelType">
6badb7 21             <el-select v-model="formData.modelType" placeholder="请选择">
22               <el-option
8ea580 23                 v-for="dict in getStrDictOptions(DICT_TYPE.SCHE_MODEL_TYPE)"
6badb7 24                 :key="dict.value"
25                 :label="dict.label"
26                 :value="dict.value"
27               />
28             </el-select>
2f0aa4 29           </el-form-item>
30         </el-col>
31         <el-col :span="12">
32           <el-form-item label="调用方式" prop="invocation">
6badb7 33             <el-select v-model="formData.invocation" placeholder="请选择">
34               <el-option
8ea580 35                 v-for="dict in getStrDictOptions(DICT_TYPE.SCHE_MODEL_INVOCATION)"
6badb7 36                 :key="dict.value"
37                 :label="dict.label"
38                 :value="dict.value"
39               />
40             </el-select>
2f0aa4 41           </el-form-item>
42         </el-col>
43       </el-row>
22bece 44       <el-divider content-position="left">模型信息</el-divider>
D 45       <div style="width: 120px;text-align: right;margin-bottom: 8px">
e4de9b 46         <el-popover placement="right" :width="300" trigger="click" ref="modelPopover" @before-enter="model = undefined">
22bece 47           <template #reference>
D 48             <span style="color: #409eff;cursor: pointer">关联模型信息</span>
49           </template>
50           <template #default>
51             <div style="display:flex;flex-direction: row;align-items: center;">
52               <el-cascader style="width: 100%" v-model="model" placeholder="选择模型" :teleported="false" @change="changeModel" :options="scheduleModelList"/>
53             </div>
54           </template>
55         </el-popover>
56       </div>
2f0aa4 57       <el-row>
22bece 58         <el-col :span="12">
D 59           <el-form-item label="模型名称" prop="modelName">
091c7e 60             <el-input v-model="formData.modelName" placeholder="请输入模型名称"/>
22bece 61           </el-form-item>
D 62         </el-col>
63         <el-col :span="12">
2f0aa4 64           <el-form-item label="类名" prop="className">
22bece 65             <el-input v-model="formData.className" placeholder="请输入类名" :disabled="true" />
2f0aa4 66           </el-form-item>
67         </el-col>
68       </el-row>
69       <el-row>
70         <el-col :span="12">
71           <el-form-item label="方法名" prop="methodName">
22bece 72             <el-input v-model="formData.methodName" placeholder="请输入方法名" :disabled="true" />
2f0aa4 73           </el-form-item>
74         </el-col>
75         <el-col :span="12">
76           <el-form-item label="参数数量" prop="portLength">
22bece 77             <el-input-number v-model="formData.portLength" :min="0" controls-position="right" :disabled="true" />
2f0aa4 78           </el-form-item>
79         </el-col>
80       </el-row>
81       <el-row>
82         <el-col :span="24">
83           <el-form-item label="参数构造" prop="paramStructure">
22bece 84             <el-input v-model="formData.paramStructure" placeholder="请输入参数构造" :disabled="true" />
2f0aa4 85           </el-form-item>
86         </el-col>
87       </el-row>
88       <el-row>
89         <el-col :span="24">
90           <el-form-item label="模型路径" prop="modelPath">
22bece 91             <el-input v-model="formData.modelPath" placeholder="模型路径" :disabled="true" />
2f0aa4 92           </el-form-item>
93         </el-col>
94       </el-row>
95       <el-divider content-position="left">输入参数</el-divider>
96       <el-table
97         :data="formData.paramList"
98         border
99         style="width: 100%; margin-top: 5px;">
100         <el-table-column
101           prop=""
102           label="端口"
103           width="100"
104           align="center">
6badb7 105           <template #default="scope">
22bece 106             <el-input v-model="scope.row.modelparamportorder" maxlength="5" clearable :disabled="true"
6badb7 107                       style="width:100%; hight:100%"/>
2f0aa4 108           </template>
109         </el-table-column>
110         <el-table-column
111           prop=""
112           label="序号"
113           width="100"
114           align="center">
6badb7 115           <template #default="scope">
22bece 116             <el-input v-model="scope.row.modelparamorder" maxlength="5" clearable
6badb7 117                       style="width:100%;hight:100%"/>
2f0aa4 118           </template>
119         </el-table-column>
120         <el-table-column
121           prop=""
122           label="类型"
123           width="150"
124           align="center">
6badb7 125           <template #default="scope">
22bece 126             <el-select v-model="scope.row.modelparamtype" placeholder="请选择" @change="changeModelparamtype(scope.row)">
2f0aa4 127               <el-option
8ea580 128                 v-for="dict in getStrDictOptions(DICT_TYPE.MODEL_PARAM_TYPE)"
2f0aa4 129                 :key="dict.value"
130                 :label="dict.label"
131                 :value="dict.value"
132               />
133             </el-select>
134           </template>
135         </el-table-column>
8ea580 136         <el-table-column
2f0aa4 137           prop=""
138           label="参数名称"
139           align="center">
6badb7 140           <template #default="scope">
22bece 141             <el-select v-if="scope.row.modelparamtype === 'NormalItem'"
D 142               v-model="scope.row.modelparamid"
143               placeholder="请选择"
144               filterable
145               style="width: 100%">
146               <el-option-group
147                 v-for="group in modelparamListMap['NormalItem']"
148                 :key="group.value"
149                 :label="group.label"
150               >
151                 <el-option
152                   v-for="item in group.children"
153                   :key="item.value"
154                   :label="item.label"
155                   :value="item.value"
156                 />
157               </el-option-group>
158             </el-select>
159             <el-select v-else
2f0aa4 160               v-model="scope.row.modelparamid"
161               filterable
162               placeholder="请选择">
163               <el-option
d3ee81 164                 v-for="(item, index) in modelparamListMap[scope.row.modelparamtype]"
2f0aa4 165                 :key="index"
166                 :label="item.name"
d3ee81 167                 :value="item.id"/>
2f0aa4 168             </el-select>
169           </template>
8ea580 170         </el-table-column>
2f0aa4 171         <el-table-column
172           prop=""
173           label="参数长度"
d3ee81 174           width="160"
2f0aa4 175           align="center">
6badb7 176           <template #default="scope">
d3ee81 177             <el-input-number v-model="scope.row.datalength" :min="0" clearable controls-position="right"
178                              style="width:100%;hight:100%"/>
2f0aa4 179           </template>
180         </el-table-column>
181         <el-table-column
182           prop=""
183           label="操作"
184           width="100"
185           align="center">
6badb7 186           <template #default="scope">
2f0aa4 187             <el-button
6badb7 188               link
189               @click.prevent="addRow(scope.$index, formData.paramList)"
190               type="primary"
2f0aa4 191               size="small">
192               添加
193             </el-button>
194             <el-button
6badb7 195               link
22bece 196               @click.prevent="deleteRow(scope.$index, scope.row, formData.paramList)"
6badb7 197               type="primary"
2f0aa4 198               size="small">
199               删除
200             </el-button>
201           </template>
202         </el-table-column>
203       </el-table>
204
205       <el-divider content-position="left">设置参数</el-divider>
206       <el-table
6badb7 207         :data="formData.settingList"
2f0aa4 208         border
209         style="width: 100%; margin-top: 5px;">
210         <el-table-column
211           prop=""
212           label="键"
213           align="center">
6badb7 214           <template #default="scope">
22bece 215             <el-input v-model="scope.row.key" maxlength="20" clearable :disabled="true"
6badb7 216                       style="width:100%;hight:100%"/>
2f0aa4 217           </template>
218         </el-table-column>
219         <el-table-column
220           prop=""
221           label="名称"
222           align="center">
6badb7 223           <template #default="scope">
22bece 224             <el-input v-model="scope.row.name" maxlength="20" clearable :disabled="true"
6badb7 225                       style="width:100%;hight:100%"/>
2f0aa4 226           </template>
227         </el-table-column>
228         <el-table-column
229           prop=""
230           label="类型"
231           align="center">
6badb7 232           <template #default="scope">
22bece 233             <el-select v-model="scope.row.valuetype" placeholder="请选择" :disabled="true">
d3ee81 234               <el-option
235                 v-for="dict in getStrDictOptions(DICT_TYPE.MODEL_METHOD_SETTING_VALUE_TYPE)"
236                 :key="dict.value"
237                 :label="dict.label"
238                 :value="dict.value"
239               />
240             </el-select>
2f0aa4 241           </template>
242         </el-table-column>
243         <el-table-column
244           prop=""
245           label="值"
246           align="center">
6badb7 247           <template #default="scope">
22bece 248             <el-input v-model="scope.row.value" maxlength="256" clearable  :disabled="scope.row.key === 'pyFile'"
6badb7 249                       style="width:100%;hight:100%"/>
2f0aa4 250           </template>
251         </el-table-column>
22bece 252 <!--        <el-table-column-->
D 253 <!--          prop=""-->
254 <!--          label="操作"-->
255 <!--          width="100"-->
256 <!--          align="center">-->
257 <!--          <template #default="scope">-->
258 <!--            <el-button-->
259 <!--              @click.prevent="addRow(scope.$index, formData.settingList)"-->
260 <!--              link-->
261 <!--              type="primary"-->
262 <!--              size="small">-->
263 <!--              添加-->
264 <!--            </el-button>-->
265 <!--            <el-button-->
266 <!--              @click.prevent="deleteRow(scope.$index, formData.settingList)"-->
267 <!--              link-->
268 <!--              type="primary"-->
269 <!--              size="small">-->
270 <!--              删除-->
271 <!--            </el-button>-->
272 <!--          </template>-->
273 <!--        </el-table-column>-->
2f0aa4 274       </el-table>
23c8b8 275       <el-divider content-position="left">模型下发配置</el-divider>
D 276       <el-row :gutter="20">
277         <el-col :span="4">
278           <el-button type="primary" size="small" @click="addRowOut()" >新增</el-button>
279         </el-col>
280       </el-row>
281       <el-table
282         :data="formData.modelOut"
283         border
284         style="width: 100%; margin-top: 5px;">
fa3d25 285         <el-table-column prop="resultKey" label="输出key" align="center" min-width="100">
23c8b8 286           <template #default="scope">
D 287             <el-input size="mini" v-model="scope.row.resultKey" style="width:100%;height:100%"/>
288           </template>
289         </el-table-column>
fa3d25 290         <el-table-column prop="resultType" label="数据类型" align="center" min-width="150">
23c8b8 291           <template #default="scope">
fa3d25 292             <el-select v-model="scope.row.resultType" placeholder="请选择">
D 293               <el-option
294                 v-for="dict in getStrDictOptions(DICT_TYPE.RESULT_TYPE)"
295                 :key="dict.value"
296                 :label="dict.label"
297                 :value="dict.value"
298               />
299             </el-select>
23c8b8 300           </template>
D 301         </el-table-column>
302         <el-table-column prop="resultPort" label="角标1" align="center" min-width="100">
303           <template #default="scope">
304             <el-input-number :min="0" clearable controls-position="right" size="mini" v-model="scope.row.resultPort" style="width:100%;height:100%"/>
305           </template>
306         </el-table-column>
307         <el-table-column prop="resultIndex" label="角标2" align="center" min-width="100">
308           <template #default="scope">
309             <el-input-number :min="0" clearable controls-position="right" size="mini" v-model="scope.row.resultIndex" style="width:100%;height:100%"/>
310           </template>
311         </el-table-column>
312         <el-table-column prop="isWrite" label="是否下发" align="center" min-width="100">
313           <template #default="scope">
314             <el-switch size="small" v-model="scope.row.isWrite" :active-value="1"
315                        :inactive-value="0"/>
316           </template>
317         </el-table-column>
318         <el-table-column
319           prop=""
320           label="测点名称"
321           align="center" min-width="200">
322           <template #default="scope">
323             <el-select v-model="scope.row.pointNo"
324                        filterable
325                        placeholder="请选择">
326               <el-option
327                 v-for="(item, index) in modelparamListMap['DATAPOINT']"
328                 :key="index"
329                 :label="item.name"
330                 :value="item.itemNo"/>
331             </el-select>
332           </template>
333         </el-table-column>
334         <el-table-column prop="disturbancePointNo’" label="无扰切换点位" align="center" min-width="200">
335           <template #default="scope">
336             <el-select v-model="scope.row.disturbancePointNo"
337                        filterable
338                        placeholder="请选择">
339               <el-option
340                 v-for="(item, index) in modelparamListMap['DATAPOINT']"
341                 :key="index"
342                 :label="item.name"
343                 :value="item.itemNo"/>
344             </el-select>
345           </template>
346         </el-table-column>
347         <el-table-column label="操作" fixed="right" header-align="center" align="center" width="100">
348           <template #default="scope">
349             <el-button
350               @click="deleteModelOutRow(scope.$index)"
351               key="danger"
352               type="danger"
353               link
354             >删除
355             </el-button>
356           </template>
357         </el-table-column>
358       </el-table>
2f0aa4 359     </el-form>
360     <template #footer>
361       <el-button :disabled="formLoading" type="primary" @click="submitForm">确 定</el-button>
362       <el-button @click="dialogVisible = false">取 消</el-button>
363     </template>
364   </Dialog>
365 </template>
366 <script lang="ts" setup>
8ea580 367   import { DICT_TYPE, getStrDictOptions } from '@/utils/dict'
2f0aa4 368   import * as ScheduleModelApi from '@/api/model/sche/model'
369   import { CommonStatusEnum } from '@/utils/constants'
22bece 370   import * as MpkApi from "@/api/model/mpk/mpk";
23c8b8 371   import {generateUUID} from "@/utils";
2f0aa4 372
373   defineOptions({ name: 'ScheduleModelForm' })
374
375   const { t } = useI18n() // 国际化
376   const message = useMessage() // 消息弹窗
377   const dialogVisible = ref(false) // 弹窗的是否展示
378   const dialogTitle = ref('') // 弹窗的标题
379   const formLoading = ref(false) // 表单的加载中:1)修改时的数据加载;2)提交的按钮禁用
380   const formType = ref('') // 表单的类型:create - 新增;update - 修改
381   const formData = ref({
382     id: undefined,
383     modelCode: undefined,
384     modelName: undefined,
385     modelType: undefined,
386     className: undefined,
387     methodName: undefined,
388     portLength: undefined,
389     paramStructure: undefined,
390     modelPath: undefined,
391     resultStrId: undefined,
392     invocation: undefined,
8ea580 393     status: CommonStatusEnum.ENABLE,
22bece 394     paramList: [],
23c8b8 395     settingList: [],
D 396     modelOut: []
2f0aa4 397   })
398   const formRules = reactive({
399     modelCode: [{ required: true, message: '模型编号不能为空', trigger: 'blur' }],
400     modelName: [{ required: true, message: '模型名称不能为空', trigger: 'blur' }],
401     modelType: [{ required: true, message: '模型类型不能为空', trigger: 'blur' }]
402   })
403   const formRef = ref() // 表单 Ref
6badb7 404   const modelparamListMap = ref({})
22bece 405   // 调度模型列表
D 406   const scheduleModelList = ref([])
407   const model = ref()
408   const modelPopover = ref()
2f0aa4 409
410   const addRow = function (index, rows) {
411     let row = JSON.parse(JSON.stringify(rows[index]))
412     rows.splice(index, 0, row)
413     this.orderRow(rows)
414   }
415
22bece 416   const deleteRow = function (index, row, rows) {
D 417     if (!rows || rows.length === 1 || rows.filter(e => e.modelparamportorder === row.modelparamportorder).length === 1) {
418       message.error('不可删除!')
2f0aa4 419       return
420     }
421     rows.splice(index, 1)
422     this.orderRow(rows)
423   }
424
425   const orderRow = function (rows) {
426     let modelparamorder = 0
427     let modelparamportorder = 0
428     rows.forEach(function (value) {
429       if (value.modelparamportorder !== modelparamportorder) {
430         modelparamportorder = value.modelparamportorder
431         modelparamorder = 1
432       }
433       value.modelparamorder = modelparamorder
434       modelparamorder++
435     })
436   }
437
438   /** 打开弹窗 */
439   const open = async (type: string, id?: number) => {
440     dialogVisible.value = true
441     dialogTitle.value = t('action.' + type)
442     formType.value = type
443     resetForm()
444     // 修改时,设置数据
445     if (id) {
446       formLoading.value = true
447       try {
448         formData.value = await ScheduleModelApi.getScheduleModel(id)
449       } finally {
450         formLoading.value = false
451       }
452     }
d3ee81 453     // 加载参数列表
454     modelparamListMap.value = await ScheduleModelApi.getModelParamList()
22bece 455     // 加载调度模型列表
D 456     getScheduleModelList()
2f0aa4 457   }
458   defineExpose({ open }) // 提供 open 方法,用于打开弹窗
459
460   /** 提交表单 */
461   const emit = defineEmits(['success']) // 定义 success 事件,用于操作成功后的回调
462   const submitForm = async () => {
463     // 校验表单
464     if (!formRef) return
465     const valid = await formRef.value.validate()
466     if (!valid) return
467     // 提交请求
468     formLoading.value = true
469     try {
470       const data = formData.value as unknown as ScheduleModelApi.ScheduleModelVO
471       if (formType.value === 'create') {
472         await ScheduleModelApi.createScheduleModel(data)
473         message.success(t('common.createSuccess'))
474       } else {
475         await ScheduleModelApi.updateScheduleModel(data)
476         message.success(t('common.updateSuccess'))
477       }
478       dialogVisible.value = false
479       // 发送操作成功的事件
480       emit('success')
481     } finally {
482       formLoading.value = false
483     }
484   }
485
486   /** 重置表单 */
487   const resetForm = () => {
488     formData.value = {
489       id: undefined,
490       modelCode: undefined,
491       modelName: undefined,
492       modelType: undefined,
493       className: undefined,
494       methodName: undefined,
495       portLength: undefined,
496       paramStructure: undefined,
497       modelPath: undefined,
498       resultStrId: undefined,
499       invocation: undefined,
6badb7 500       status: CommonStatusEnum.ENABLE,
22bece 501       paramList: [],
23c8b8 502       settingList: [],
D 503       modelOut: []
2f0aa4 504     }
505     formRef.value?.resetFields()
506   }
22bece 507
D 508   const getScheduleModelList = async () => {
509     let list = await MpkApi.list({pyType: 'schedul'})
510     if (list && list.length > 0) {
511       scheduleModelList.value = list.map(e => {
512         return {
513           label: e.pyChineseName,
514           value: e,
515           children: e.modelMethods.map(m => {
516             return {
517               label: m.methodName,
518               value: m
519             }
520           })
521         }
522       })
523     }
524   }
525
526   // 选择调度模型
527   const changeModel = async () => {
528     // 校验
529     if (model.value && model.value.length > 0) {
530       const modelInfo = model.value[0]
531       const methodInfo = model.value[1]
532       formData.value.modelName = modelInfo.pyChineseName
533       formData.value.className = modelInfo.pkgName + '.impl.' + modelInfo.pyName + 'Impl';
534       formData.value.methodName = methodInfo.methodName
535       formData.value.portLength = methodInfo.dataLength
536       // 参数构造
537       let paramStructure = []
538       for (let i = 0; i < methodInfo.dataLength; i++) {
539         paramStructure.push('[[D')
540       }
541       if (methodInfo.model === 1) {
542         paramStructure.push('java.util.HashMap')
543       }
544       paramStructure.push('java.util.HashMap')
545       formData.value.paramStructure = paramStructure.join(',')
546       formData.value.modelPath = modelInfo.pyModule
547       // 输入参数
548       let paramList = []
549       for (let i = 0; i < methodInfo.dataLength; i++) {
550         paramList.push({
551           modelparamportorder: i+1 + '',
552           modelparamorder: '1',
553           modelparamtype: '',
554           modelparamid: '',
555           datalength: 0
556         })
557       }
558
559       formData.value.paramList = paramList
560       // 设置参数
561       let settingList = []
562       methodInfo.methodSettings.forEach(e => {
563         settingList.push({
564           key: e.settingKey,
565           value: e.value,
566           valuetype: e.valueType,
567           name: e.name
568         })
569       })
570       formData.value.settingList = settingList
571       modelPopover.value.hide()
572     }else {
573       message.error("请先选择模型")
574     }
575   }
576
577   function changeModelparamtype(row) {
578     row.modelparamid = ''
579   }
23c8b8 580   const addRowOut= function () {
D 581     if(formData.value.modelOut===undefined) {
582       formData.value.modelOut = []
583     }
584     formData.value.modelOut.push({
585       id: generateUUID(),
586       resultKey: undefined,
587       resultType: "double[][]",
588       port: 0,
589       index: 0,
590       isWrite: 1,
591       pointNo:undefined,
592       sort:undefined,
593       disturbancePointNo:undefined,
594     })
595   }
596   const deleteModelOutRow = function (index) {
597     formData.value.modelOut.splice(index, 1)
598   }
2f0aa4 599 </script>