From da3e9475f6c965a85fdb53cee770aafcc251ad5b Mon Sep 17 00:00:00 2001
From: gerson <1405270578@qq.com>
Date: 星期六, 31 八月 2024 21:12:19 +0800
Subject: [PATCH] 修改管理页面
---
src/views/project/yw/lowCode/sqlAmis/SqlAmis.vue | 237 ++++++++++++++++++++++++-----------------------------------
1 files changed, 97 insertions(+), 140 deletions(-)
diff --git a/src/views/project/yw/lowCode/sqlAmis/SqlAmis.vue b/src/views/project/yw/lowCode/sqlAmis/SqlAmis.vue
index 2957131..a0109cf 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">
@@ -9,37 +9,54 @@
<el-form-item>
<el-button type="primary" icon="ele-Search" @click="handleQueryTable"> 鏌ヨ </el-button>
<el-button icon="ele-Refresh" @click="resetQuery">閲嶇疆 </el-button>
- <el-button icon="ele-Plus" @click="openOperateDialog()"> 娣诲姞 </el-button>
+ <el-button icon="ele-Plus" @click="openOptDlg()"> 娣诲姞 </el-button>
</el-form-item>
</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>
+ <el-table-column prop="published" label="鐘舵��" width="120" show-overflow-tooltip>
<template #default="scope">
- {{ supervisorPublishedMap[scope.row.published] }}
+ <el-select
+ :modelValue="displayTableData[scope.$index].published"
+ @change="(value) => publishStatusChange(value, scope.row.id, scope.$index)"
+ >
+ <el-option
+ v-for="item in Object.keys(supervisorPublishedMap)"
+ :key="item"
+ :value="item"
+ :label="supervisorPublishedMap[item]"
+ ></el-option>
+ </el-select>
</template>
</el-table-column>
<el-table-column label="鍒涘缓浜�" prop="creator" width="100" show-overflow-tooltip> </el-table-column>
<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">
@@ -47,74 +64,48 @@
<i class="ywifont ywicon-sql !text-[14px] text-blue-400 cursor-pointer" @click="editSqlClick(scope.row)"></i>
</el-tooltip>
<el-tooltip effect="dark" content="缂栬緫" placement="top">
- <i class="ywifont ywicon-bianji !text-[14px] text-blue-400 cursor-pointer" @click="openOperateDialog(scope.row)"></i>
+ <i class="ywifont ywicon-bianji !text-[14px] text-blue-400 cursor-pointer" @click="openOptDlg(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.deleteSupervisor, () => {
+ const foundIndex = tableData.findIndex((item) => item === scope.row);
+ foundIndex > -1 && tableData.splice(foundIndex, 1);
+ });
+ }
+ "
+ ></i>
</el-tooltip>
</div>
</template>
</el-table-column>
</el-table>
</template>
- <ywDialog
- v-model="dialogIsShow"
- :headerIcon="dialogHeaderIcon"
- :title="dialogTitle"
- width="400"
- @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-item>
- <el-form-item label="undefined" prop="ParentID">
- <el-input v-model="dialogFormValue.ParentID"></el-input>
- </el-form-item>
- <el-form-item label="鏍囬" prop="Name">
- <el-input v-model="dialogFormValue.Name"></el-input>
- </el-form-item>
- <el-form-item label="缂栫爜" prop="Code">
- <el-input v-model="dialogFormValue.Code"></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>
- </el-form>
- </ywDialog>
+
+ <OptDlg v-model="optDlgIsShow" :item="optDlgMapRow" @insert="insertOpt" @update="updateOpt"></OptDlg>
</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';
+import { onMounted, ref } from 'vue';
import HMContainer from '/@/components/layout/HMContainer.vue';
import { usePageDisplay } from '/@/hooks/usePageDisplay';
import { useQueryTable } from '/@/hooks/useQueryTable';
// import { useTableSort } from '/@/hooks/useTableSort';
// import { useValidateUniqueness } from '/@/hooks/useValidateUniqueness';
-import { deepClone } from '/@/utils/other';
-import { supervisorPublishedMap } from './types';
+import SqlAmisEdit from './edit/SqlAmisEdit.vue';
+import OptDlg from './optDlg/OptDlg.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 { updatePublishStatus } from '/@/api/supervisorAdmin';
+import JsonEditor from '/@/components/form/jsonEditor/JsonEditor.vue';
//#region ====================== 琛ㄦ牸鏁版嵁锛宼able init ======================
const tableLoading = ref(false);
@@ -126,8 +117,8 @@
tableLoading.value = false;
});
tableData.value = (res.values || []).map((item) => {
- item.create_time = item.create_time.slice(0, 10);
- item.update_time = item.create_time.slice(0, 10);
+ item.create_time = item.create_time?.slice(0, 10);
+ item.update_time = item.create_time?.slice(0, 10);
return item;
});
@@ -145,68 +136,6 @@
//#endregion
-//#region ====================== 澧炲姞銆佷慨鏀硅褰曟搷浣�, dialog init======================
-const isEditDialog = ref(false);
-const dialogTitle = computed(() => {
- return isEditDialog.value ? '淇敼鍒嗙粍' : '娣诲姞鍒嗙粍';
-});
-const dialogHeaderIcon = computed(() => {
- return isEditDialog.value ? 'ele-Edit' : 'ele-Plus';
-});
-const dialogFormValue = ref(null);
-const dialogIsShow = ref(false);
-const dialogFormRef = ref<FormInstance>(null);
-
-const dialogFormRules = ref<FormRules>({
- ParentID: [{ required: true, message: '璇烽�夋嫨undefined', trigger: 'change' }],
- Name: [{ required: true, message: '璇疯緭鍏ユ爣棰�', trigger: 'blur' }],
-});
-const openOperateDialog = (row?) => {
- if (row) {
- isEditDialog.value = true;
- const { ID, ParentID, Name, Code, Description } = row;
-
- dialogFormValue.value = deepClone({ ID, ParentID, Name, Code, Description });
- } else {
- isEditDialog.value = false;
-
- dialogFormValue.value = { ParentID: '', Name: '', Code: '', Description: '' };
- }
- dialogIsShow.value = true;
-};
-const closeDialog = () => {
- dialogIsShow.value = false;
- dialogFormRef.value.clearValidate();
-};
-
-const submitFormValue = async () => {
- const valid = await dialogFormRef.value.validate().catch(() => {});
- if (!valid) return;
-
- if (isEditDialog.value) {
- const res = await supervisorAdminApi.UpdateADictGroup(dialogFormValue.value);
- const resData = res.Data;
- if (resData) {
- getTableData();
- closeDialog();
- ElMessage.success('淇敼鍒嗙粍鎴愬姛');
- } else {
- ElMessage.error('淇敼鍒嗙粍澶辫触');
- }
- } else {
- const res = await supervisorAdminApi.InsertADictGroup(dialogFormValue.value);
- const resData = res.Data;
- if (resData === '0') {
- ElMessage.error('娣诲姞鍒嗙粍澶辫触');
- return;
- }
- getTableData();
- closeDialog();
- ElMessage.success('娣诲姞鍒嗙粍鎴愬姛');
- }
-};
-
-//#endregion
//#region ====================== 鏌ヨ蹇嵎閿� ======================
const queryFormRef = ref(null);
const pressEnterSearch = (ev: KeyboardEvent) => {
@@ -216,31 +145,59 @@
};
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 ====================== 瑙ｅ喅鎷栨嫿灞曞紑鐘舵�佸け鏁堥棶棰� ======================
-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
+
+//#region ====================== 娣诲姞淇敼鎿嶄綔 ======================
+const optDlgIsShow = ref(false);
+const optDlgMapRow = ref(null);
+const openOptDlg = (row?: any) => {
+ optDlgMapRow.value = row;
+ optDlgIsShow.value = true;
+};
+
+const updateOpt = (formValue) => {
+ const foundIndex = tableData.value.find((item) => item.id === formValue.id);
+ if (foundIndex > -1) {
+ tableData.value[foundIndex] = {
+ ...tableData.value[foundIndex],
+ ...formValue,
+ };
+ }
+};
+
+const insertOpt = (newData) => {
+ tableData.value.unshift({ ...newData, published: SupervisorPublished.N });
+};
+//#endregion
+//#region ====================== 鏀瑰彉鍙戝竷鐘舵�� ======================
+const publishStatusChange = async (isPublished: SupervisorPublished, id, index) => {
+ console.log('馃殌 ~ id:', id);
+ const res = await updatePublishStatus({
+ id: id,
+ publish: isPublished,
+ });
+ displayTableData.value[index].published = isPublished;
+};
//#endregion
onMounted(() => {
getTableData();
--
Gitblit v1.9.3