From 7cd99337a98b10807bd387255121a8b29dbb1f4a Mon Sep 17 00:00:00 2001 From: wujingjing <gersonwu@qq.com> Date: 星期五, 30 八月 2024 14:07:34 +0800 Subject: [PATCH] 页面管理对接接口 --- src/views/project/yw/lowCode/sqlAmis/SqlAmis.vue | 153 +++++++++++++++++++++++++++++---------------------- 1 files changed, 87 insertions(+), 66 deletions(-) diff --git a/src/views/project/yw/lowCode/sqlAmis/SqlAmis.vue b/src/views/project/yw/lowCode/sqlAmis/SqlAmis.vue index 2957131..a545bdc 100644 --- a/src/views/project/yw/lowCode/sqlAmis/SqlAmis.vue +++ b/src/views/project/yw/lowCode/sqlAmis/SqlAmis.vue @@ -1,5 +1,5 @@ <template> - <HMContainer type="card"> + <HMContainer type="card" v-if="supervisorMgrShow"> <template #header> <el-form ref="queryFormRef" :inline="true" :model="queryParams"> <el-form-item label="鏍囬" prop="title"> @@ -14,19 +14,28 @@ </el-form> </template> <template #main> + <!-- <div class="h-screen"> + <p>vue-json-editor</p> + <JsonEditorVue v-model="jsonMsg"></JsonEditorVue> + </div> --> <el-table v-loading="tableLoading" ref="draggableTableRef" class="h100" border - row-key="ID" - :tree-props="{ children: 'Children', hasChildren: 'hasChildren' }" - :expand-row-keys="treeTableExpandKeys" - @expand-change="tableExpandChange" :row-class-name="isDragStatus ? 'cursor-move' : 'cursor-pointer'" :data="displayTableData" highlight-current-row > + <el-table-column type="expand" fixed="left"> + <template #default="scope"> + <div class="px-4"> + <h3 class="mb-2">椤甸潰鍙傛暟</h3> + <JsonEditor currentMode="view" :modelValue="scope.row.args" /> + </div> + </template> + </el-table-column> + <el-table-column prop="title" label="鏍囬" width="300" fixed="left" show-overflow-tooltip> </el-table-column> <el-table-column prop="prompt" label="鎻愮ず璇�" show-overflow-tooltip> </el-table-column> <el-table-column prop="published" label="鐘舵��" width="80" show-overflow-tooltip> @@ -38,8 +47,6 @@ <el-table-column label="鍒涘缓鏃堕棿" prop="create_time" width="105" show-overflow-tooltip> </el-table-column> <el-table-column label="鏇存柊鏃堕棿" prop="update_time" width="105" show-overflow-tooltip> </el-table-column> <el-table-column label="澶囨敞" prop="note" show-overflow-tooltip> </el-table-column> - <!-- <el-table-column prop="Code" label="缂栫爜" show-overflow-tooltip> </el-table-column> - <el-table-column prop="Description" label="璇存槑" width="550" show-overflow-tooltip> </el-table-column> --> <el-table-column label="鎿嶄綔" width="120" fixed="right" show-overflow-tooltip> <template #default="scope"> <div class="space-x-2.5"> @@ -50,7 +57,17 @@ <i class="ywifont ywicon-bianji !text-[14px] text-blue-400 cursor-pointer" @click="openOperateDialog(scope.row)"></i> </el-tooltip> <el-tooltip effect="dark" content="鍒犻櫎" placement="top"> - <i class="ywifont ywicon-shanchu !text-[17px] text-red-400 cursor-pointer" @click="openOperateDialog(scope.row)"></i> + <i + class="ywifont ywicon-shanchu !text-[17px] text-red-400 cursor-pointer" + @click=" + () => { + deleteCurrentRow(scope.row, '椤甸潰', supervisorAdminApi.DeleteAAssetsEquipmentCostCategory, () => { + const foundIndex = tableData.findIndex((item) => item === scope.row); + foundIndex > -1 && tableData.splice(foundIndex, 1); + }); + } + " + ></i> </el-tooltip> </div> </template> @@ -61,45 +78,44 @@ v-model="dialogIsShow" :headerIcon="dialogHeaderIcon" :title="dialogTitle" - width="400" + width="680" @dlgClosed="closeDialog" @submit="submitFormValue" > - <el-form :model="dialogFormValue" ref="dialogFormRef" :rules="dialogFormRules" label-width="55"> - <el-form-item label="鐖剁骇" prop="ParentID" v-if="!isEditDialog"> - <el-tree-select - filterable - style="width: 100%" - v-model="dialogFormValue.ParentID" - :data="tableTreeData" - node-key="id" - :clearable="true" - :accordion="true" - :expandNode="false" - :check-strictly="true" - > - </el-tree-select> + <el-form :model="dialogFormValue" ref="dialogFormRef" :rules="dialogFormRules" label-width="78"> + <el-form-item label="鏍囬" prop="title"> + <el-input v-model="dialogFormValue.title"></el-input> </el-form-item> - <el-form-item label="undefined" prop="ParentID"> - <el-input v-model="dialogFormValue.ParentID"></el-input> + <el-form-item label="鎻愮ず璇�" prop="prompt"> + <el-input v-model="dialogFormValue.prompt"></el-input> </el-form-item> - <el-form-item label="鏍囬" prop="Name"> - <el-input v-model="dialogFormValue.Name"></el-input> + <el-form-item label="鐘舵��" prop="published"> + <el-select v-model="dialogFormValue.published"> + <el-option + v-for="item in Object.keys(supervisorPublishedMap)" + :key="item" + :value="item" + :label="supervisorPublishedMap[item]" + ></el-option> + </el-select> </el-form-item> - <el-form-item label="缂栫爜" prop="Code"> - <el-input v-model="dialogFormValue.Code"></el-input> + <el-form-item label="澶囨敞" prop="note"> + <el-input v-model="dialogFormValue.note" type="textarea" :rows="3"></el-input> </el-form-item> - <el-form-item label="璇存槑" prop="Description"> - <el-input v-model="dialogFormValue.Description" type="textarea" :rows="3"></el-input> - </el-form-item> + <div class="flex"> + <span class="flex-0 ml-2.5">椤甸潰鍙傛暟</span> + <JsonEditor class="ml-3 h-80" :showToolbar="true" currentMode="form" v-model="dialogFormValue.args" /> + </div> </el-form> </ywDialog> </HMContainer> + <SqlAmisEdit v-else :supervisor="sqlEditMapSupervisor" @backLastPage="backLastPage"></SqlAmisEdit> </template> <script setup lang="ts"> import type { FormInstance, FormRules } from 'element-plus'; import { ElMessage } from 'element-plus'; +import { deleteCurrentRow } from '/@/utils/util'; import { computed, onMounted, ref } from 'vue'; import ywDialog from '/@/components/dialog/yw-dialog.vue'; @@ -110,11 +126,10 @@ // import { useValidateUniqueness } from '/@/hooks/useValidateUniqueness'; import { deepClone } from '/@/utils/other'; -import { supervisorPublishedMap } from './types'; +import SqlAmisEdit from './edit/SqlAmisEdit.vue'; +import { SupervisorPublished, supervisorPublishedMap } from './types'; import * as supervisorAdminApi from '/@/api/supervisorAdmin'; -import { convertListToTree, tableCellCenterExceptColumn } from '/@/utils/util'; -import { gotoRoute } from '/@/utils/route'; -const tableTreeData = computed(() => convertListToTree(tableData.value)); +import JsonEditor from '/@/components/form/jsonEditor/JsonEditor.vue'; //#region ====================== 琛ㄦ牸鏁版嵁锛宼able init ====================== const tableLoading = ref(false); @@ -148,7 +163,7 @@ //#region ====================== 澧炲姞銆佷慨鏀硅褰曟搷浣�, dialog init====================== const isEditDialog = ref(false); const dialogTitle = computed(() => { - return isEditDialog.value ? '淇敼鍒嗙粍' : '娣诲姞鍒嗙粍'; + return isEditDialog.value ? '淇敼椤甸潰' : '娣诲姞椤甸潰'; }); const dialogHeaderIcon = computed(() => { return isEditDialog.value ? 'ele-Edit' : 'ele-Plus'; @@ -158,19 +173,19 @@ const dialogFormRef = ref<FormInstance>(null); const dialogFormRules = ref<FormRules>({ - ParentID: [{ required: true, message: '璇烽�夋嫨undefined', trigger: 'change' }], - Name: [{ required: true, message: '璇疯緭鍏ユ爣棰�', trigger: 'blur' }], + title: [{ required: true, message: '璇疯緭鍏ユ爣棰�', trigger: 'change' }], + // prompt: [{ required: true, message: '杈撳叆鎻愮ず璇�', trigger: 'blur' }], }); const openOperateDialog = (row?) => { if (row) { isEditDialog.value = true; - const { ID, ParentID, Name, Code, Description } = row; + const { id, note, prompt, published, title, args } = row; - dialogFormValue.value = deepClone({ ID, ParentID, Name, Code, Description }); + dialogFormValue.value = deepClone({ id, note, prompt, published, title, args }); } else { isEditDialog.value = false; - dialogFormValue.value = { ParentID: '', Name: '', Code: '', Description: '' }; + dialogFormValue.value = { title: null, prompt: null, published: SupervisorPublished.Y, note: null }; } dialogIsShow.value = true; }; @@ -187,22 +202,32 @@ const res = await supervisorAdminApi.UpdateADictGroup(dialogFormValue.value); const resData = res.Data; if (resData) { - getTableData(); + const foundIndex = tableData.value.find((item) => item.id === dialogFormValue.value.id); + if (foundIndex > -1) { + tableData.value[foundIndex] = { + ...tableData.value[foundIndex], + ...dialogFormValue.value, + }; + } closeDialog(); - ElMessage.success('淇敼鍒嗙粍鎴愬姛'); + ElMessage.success('淇敼椤甸潰鎴愬姛'); } else { - ElMessage.error('淇敼鍒嗙粍澶辫触'); + ElMessage.error('淇敼椤甸潰澶辫触'); } } else { const res = await supervisorAdminApi.InsertADictGroup(dialogFormValue.value); const resData = res.Data; if (resData === '0') { - ElMessage.error('娣诲姞鍒嗙粍澶辫触'); + ElMessage.error('娣诲姞椤甸潰澶辫触'); return; } - getTableData(); + const newData = { + id: resData, + ...dialogFormValue.value, + }; + tableData.value.push(newData); closeDialog(); - ElMessage.success('娣诲姞鍒嗙粍鎴愬姛'); + ElMessage.success('娣诲姞椤甸潰鎴愬姛'); } }; @@ -216,32 +241,28 @@ }; usePageDisplay( () => { - queryFormRef.value.$el.addEventListener('keypress', pressEnterSearch); + queryFormRef.value?.$el?.addEventListener('keypress', pressEnterSearch); }, () => { - queryFormRef.value?.$el.removeEventListener('keypress', pressEnterSearch); + queryFormRef.value?.$el?.removeEventListener('keypress', pressEnterSearch); } ); //#endregion -//#region ====================== 瑙e喅鎷栨嫿灞曞紑鐘舵�佸け鏁堥棶棰� ====================== -const treeTableExpandKeys = ref([]); -const tableExpandChange = (row, expanded) => { - if (expanded) { - treeTableExpandKeys.value.push(row.ID); - } else { - const idx = treeTableExpandKeys.value.indexOf(row.ID); - treeTableExpandKeys.value.splice(idx, 1); - } -}; //#endregion - //#region ====================== sql ====================== - const editSqlClick = () => { - gotoRoute({ - name:'SqlAmisEdit' - }) - }; + +const supervisorMgrShow = ref(true); +const sqlEditMapSupervisor = ref(null); +const editSqlClick = (item) => { + sqlEditMapSupervisor.value = item; + supervisorMgrShow.value = false; +}; + +const backLastPage = () => { + supervisorMgrShow.value = true; +}; //#endregion + onMounted(() => { getTableData(); }); -- Gitblit v1.9.3