From 85cb0a27c886a82b08f80d42f17a24d5b8389259 Mon Sep 17 00:00:00 2001
From: wujingjing <gersonwu@qq.com>
Date: 星期五, 30 八月 2024 17:11:13 +0800
Subject: [PATCH] 独立出编辑添加页面
---
src/layout/routerView/iframes.vue | 25 ++++
src/layout/routerView/parent.vue | 2
src/views/project/yw/lowCode/amis/AmisEditor.vue | 11 +
src/api/login/UserMenuData.ts | 2
src/views/project/yw/lowCode/sqlAmis/optDlg/OptDlg.vue | 133 ++++++++++++++++++++++
customer_list/yw/static/config/route.js | 4
src/views/project/yw/lowCode/sqlAmis/SqlAmis.vue | 144 ++++-------------------
7 files changed, 202 insertions(+), 119 deletions(-)
diff --git a/customer_list/yw/static/config/route.js b/customer_list/yw/static/config/route.js
index 4086aea..c9b0161 100644
--- a/customer_list/yw/static/config/route.js
+++ b/customer_list/yw/static/config/route.js
@@ -1,10 +1,10 @@
window.route = [
{
- name: 'StatusPreview',
+ name: 'AmisEditor',
isKeepAlive: true,
isAffix: true,
path: '/home',
- component: '',
+ component: '/project/yw/lowCode/amis/AmisEditor.vue',
},
{
name: 'SqlAmis',
diff --git a/src/api/login/UserMenuData.ts b/src/api/login/UserMenuData.ts
index 0d97036..d1e926b 100644
--- a/src/api/login/UserMenuData.ts
+++ b/src/api/login/UserMenuData.ts
@@ -24,7 +24,7 @@
Permission: '',
Icon: 'ywifont ywicon-a-appround15',
IsIframe: true,
- OutLink: 'http://101.133.133.173:8021/',
+ OutLink: 'http://101.133.133.173:9096/amis',
IsHide: false,
Weight: 0,
SortCode: 2,
diff --git a/src/layout/routerView/iframes.vue b/src/layout/routerView/iframes.vue
index 52406e3..0770ef6 100644
--- a/src/layout/routerView/iframes.vue
+++ b/src/layout/routerView/iframes.vue
@@ -12,17 +12,20 @@
style="position: absolute"
:data-url="v.path"
v-if="getRoutePath === v.path"
+ @load="iframeLoad"
ref="iframeRef"
/>
</transition-group>
</div>
</div>
+ <AmisPageOptDlg v-model="amisPageShow" :item="amisPageMapRow" @insert="amisPageInsert" @update="amisPageUpdate" />
</div>
</template>
<script setup lang="ts" name="layoutIframeView">
import { computed, watch, ref, nextTick } from 'vue';
import { useRoute } from 'vue-router';
+import AmisPageOptDlg from '/@/views/project/yw/lowCode/sqlAmis/optDlg/OptDlg.vue';
// 瀹氫箟鐖剁粍浠朵紶杩囨潵鐨勫��
const props = defineProps({
@@ -98,4 +101,26 @@
deep: true,
}
);
+
+const iframeLoad = () => {
+ setTimeout(() => {
+ window.frames[0].openOptAmisPageDlg = () => {
+ amisPageShow.value = true;
+ };
+ }, 0);
+};
+
+//#region ====================== iframe 浜や簰 ======================
+const amisPageShow = ref(false);
+const amisPageMapRow = ref(null);
+
+const amisPageInsert = (...params) => {
+ window.frames?.[0]?.amisPageInsert?.(...params);
+};
+
+const amisPageUpdate = (...params) => {
+ window.frames?.[0]?.amisPageUpdate?.(...params);
+};
+
+//#endregion
</script>
diff --git a/src/layout/routerView/parent.vue b/src/layout/routerView/parent.vue
index fe1fe38..fe5b944 100644
--- a/src/layout/routerView/parent.vue
+++ b/src/layout/routerView/parent.vue
@@ -20,7 +20,6 @@
import { useThemeConfig } from '/@/stores/themeConfig';
import mittBus from '/@/utils/mitt';
import { Session } from '/@/utils/storage';
-
// 寮曞叆缁勪欢
const Iframes = defineAsyncComponent(() => import('/@/layout/routerView/iframes.vue'));
@@ -110,4 +109,5 @@
immediate: true,
}
);
+
</script>
diff --git a/src/views/project/yw/lowCode/amis/AmisEditor.vue b/src/views/project/yw/lowCode/amis/AmisEditor.vue
new file mode 100644
index 0000000..6df1a8c
--- /dev/null
+++ b/src/views/project/yw/lowCode/amis/AmisEditor.vue
@@ -0,0 +1,11 @@
+<template>
+ <div></div>
+</template>
+
+<script setup lang="ts">
+import { onMounted } from 'vue';
+
+onMounted(() => {
+});
+</script>
+<style scoped lang="scss"></style>
diff --git a/src/views/project/yw/lowCode/sqlAmis/SqlAmis.vue b/src/views/project/yw/lowCode/sqlAmis/SqlAmis.vue
index a545bdc..ac7c76e 100644
--- a/src/views/project/yw/lowCode/sqlAmis/SqlAmis.vue
+++ b/src/views/project/yw/lowCode/sqlAmis/SqlAmis.vue
@@ -9,7 +9,7 @@
<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>
@@ -54,7 +54,7 @@
<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
@@ -74,63 +74,26 @@
</el-table-column>
</el-table>
</template>
- <ywDialog
- v-model="dialogIsShow"
- :headerIcon="dialogHeaderIcon"
- :title="dialogTitle"
- width="680"
- @dlgClosed="closeDialog"
- @submit="submitFormValue"
- >
- <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="鎻愮ず璇�" prop="prompt">
- <el-input v-model="dialogFormValue.prompt"></el-input>
- </el-form-item>
- <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="note">
- <el-input v-model="dialogFormValue.note" 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>
+ <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 SqlAmisEdit from './edit/SqlAmisEdit.vue';
-import { SupervisorPublished, supervisorPublishedMap } from './types';
+import OptDlg from './optDlg/OptDlg.vue';
+import { supervisorPublishedMap } from './types';
import * as supervisorAdminApi from '/@/api/supervisorAdmin';
import JsonEditor from '/@/components/form/jsonEditor/JsonEditor.vue';
-
//#region ====================== 琛ㄦ牸鏁版嵁锛宼able init ======================
const tableLoading = ref(false);
const tableData = ref([]);
@@ -160,78 +123,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>({
- title: [{ required: true, message: '璇疯緭鍏ユ爣棰�', trigger: 'change' }],
- // prompt: [{ required: true, message: '杈撳叆鎻愮ず璇�', trigger: 'blur' }],
-});
-const openOperateDialog = (row?) => {
- if (row) {
- isEditDialog.value = true;
- const { id, note, prompt, published, title, args } = row;
-
- dialogFormValue.value = deepClone({ id, note, prompt, published, title, args });
- } else {
- isEditDialog.value = false;
-
- dialogFormValue.value = { title: null, prompt: null, published: SupervisorPublished.Y, note: null };
- }
- 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) {
- 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('淇敼椤甸潰鎴愬姛');
- } else {
- ElMessage.error('淇敼椤甸潰澶辫触');
- }
- } else {
- const res = await supervisorAdminApi.InsertADictGroup(dialogFormValue.value);
- const resData = res.Data;
- if (resData === '0') {
- ElMessage.error('娣诲姞椤甸潰澶辫触');
- return;
- }
- const newData = {
- id: resData,
- ...dialogFormValue.value,
- };
- tableData.value.push(newData);
- closeDialog();
- ElMessage.success('娣诲姞椤甸潰鎴愬姛');
- }
-};
-
-//#endregion
//#region ====================== 鏌ヨ蹇嵎閿� ======================
const queryFormRef = ref(null);
const pressEnterSearch = (ev: KeyboardEvent) => {
@@ -263,6 +154,29 @@
};
//#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.push(newData);
+};
+//#endregion
+
onMounted(() => {
getTableData();
});
diff --git a/src/views/project/yw/lowCode/sqlAmis/optDlg/OptDlg.vue b/src/views/project/yw/lowCode/sqlAmis/optDlg/OptDlg.vue
new file mode 100644
index 0000000..086a3cc
--- /dev/null
+++ b/src/views/project/yw/lowCode/sqlAmis/optDlg/OptDlg.vue
@@ -0,0 +1,133 @@
+<template>
+ <ywDialog
+ v-model="dialogIsShow"
+ :headerIcon="dialogHeaderIcon"
+ :title="dialogTitle"
+ width="680"
+ @dlgClosed="closeDialog"
+ @submit="submitFormValue"
+ >
+ <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="鎻愮ず璇�" prop="prompt">
+ <el-input v-model="dialogFormValue.prompt"></el-input>
+ </el-form-item>
+ <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="note">
+ <el-input v-model="dialogFormValue.note" 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>
+</template>
+
+<script setup lang="ts">
+import ywDialog from '/@/components/dialog/yw-dialog.vue';
+
+import type { FormInstance, FormRules } from 'element-plus';
+import { ElMessage } from 'element-plus';
+
+import { computed, ref, watch } from 'vue';
+// import { useTableSort } from '/@/hooks/useTableSort';
+// import { useValidateUniqueness } from '/@/hooks/useValidateUniqueness';
+import { deepClone } from '/@/utils/other';
+
+import { SupervisorPublished, supervisorPublishedMap } from '../types';
+import * as supervisorAdminApi from '/@/api/supervisorAdmin';
+import JsonEditor from '/@/components/form/jsonEditor/JsonEditor.vue';
+
+const props = defineProps(['item']);
+const emit = defineEmits(['update', 'insert']);
+//#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 = defineModel({
+ type: Boolean,
+});
+const dialogFormRef = ref<FormInstance>(null);
+
+const dialogFormRules = ref<FormRules>({
+ title: [{ required: true, message: '璇疯緭鍏ユ爣棰�', trigger: 'change' }],
+ // prompt: [{ required: true, message: '杈撳叆鎻愮ず璇�', trigger: 'blur' }],
+});
+const openOperateDialog = (row?) => {
+ if (row) {
+ isEditDialog.value = true;
+ const { id, note, prompt, published, title, args } = row;
+
+ dialogFormValue.value = deepClone({ id, note, prompt, published, title, args });
+ } else {
+ isEditDialog.value = false;
+
+ dialogFormValue.value = { title: null, prompt: null, published: SupervisorPublished.Y, note: null };
+ }
+};
+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) {
+ emit('update', dialogFormValue.value);
+
+ closeDialog();
+ ElMessage.success('淇敼椤甸潰鎴愬姛');
+ } else {
+ ElMessage.error('淇敼椤甸潰澶辫触');
+ }
+ } else {
+ const res = await supervisorAdminApi.InsertADictGroup(dialogFormValue.value);
+ const resData = res.Data;
+ if (resData === '0') {
+ ElMessage.error('娣诲姞椤甸潰澶辫触');
+ return;
+ }
+ const newData = {
+ id: resData,
+ ...dialogFormValue.value,
+ };
+ emit('insert', newData);
+ // tableData.value.push(newData);
+ closeDialog();
+ ElMessage.success('娣诲姞椤甸潰鎴愬姛');
+ }
+};
+
+//#endregion
+
+watch(
+ () => dialogIsShow.value,
+ (val) => {
+ if (!val) return;
+ openOperateDialog(props.item);
+ }
+);
+</script>
+<style scoped lang="scss"></style>
--
Gitblit v1.9.3